Bagaimana untuk Mengoptimumkan Permintaan Ajax dengan Mengesan Penyiapan Input Pengguna?

Melaksanakan Permintaan Ajax Setelah Input Pengguna Selesai

Banyak aplikasi memerlukan tindakan pencetus apabila input pengguna dalam masa nyata. Walau bagaimanapun, ia boleh menjadi tidak cekap untuk melaksanakan permintaan pelayan dengan setiap ketukan kekunci, kerana ia boleh membanjiri sistem dan berpotensi mengatasi pelayan. Ini adalah benar terutamanya dalam situasi seperti kemasukan kotak carian, di mana banyak permintaan akan dijana.

Melaksanakan Pengesanan Penyiapan Penaipan

Untuk menangani perkara ini, penyelesaian adalah untuk mengesan apabila pengguna telah selesai menaip sebelum memulakan permintaan ajax. Ini boleh dicapai dengan menyediakan pemasa. Begini cara ia berfungsi:

1. Permulaan Pemasa:

   • Mulakan pemasa menggunakan fungsi setTimeout JavaScript dan tetapkannya kepada tempoh yang diingini selepas yang mana tindakan akan dicetuskan. Sebagai contoh, anda boleh menetapkan pemasa 5 saat.

2. Mula/Tetap Semula Pemasa:

   • Apabila pengguna menaip aksara (acara keyup), tetapkan semula pemasa. Ini memastikan pemasa sentiasa memantau ketukan kekunci.

3. Berhenti Pemasa:

   • Apabila pengguna melepaskan kekunci ( acara keydown), kosongkan pemasa. Ini menghalang tindakan daripada dicetuskan lebih awal.

4. Pelaksanaan Tindakan:

   • Apabila pemasa tamat tempoh (iaitu, pengguna tidak menaip apa-apa untuk tempoh yang ditentukan), jalankan ajax permintaan.

Contoh Kod menggunakan jQuery:

var typingTimer;                //timer identifier
var doneTypingInterval = 5000;  //time in ms, 5 seconds for example
var $input = $('#myInput');

//on keyup, start the countdown
$input.on('keyup', function () {
  clearTimeout(typingTimer);
  typingTimer = setTimeout(doneTyping, doneTypingInterval);
});

//on keydown, clear the countdown 
$input.on('keydown', function () {
  clearTimeout(typingTimer);
});

//user is "finished typing," do something
function doneTyping () {
  //do something, such as execute your ajax request
}

Atas ialah kandungan terperinci Bagaimana untuk Mengoptimumkan Permintaan Ajax dengan Mengesan Penyiapan Input Pengguna?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!