キーを離したときではなく、ユーザーが入力を終了したときに JavaScript 関数を実行しますか? 質問する

キーを離したときではなく、ユーザーが入力を終了したときに JavaScript 関数を実行しますか? 質問する

ユーザーがテキスト ボックスへの入力を終えたときに、Ajax リクエストをトリガーしたいです。ユーザーが文字を入力するたびに関数を実行するのは望ましくありません。そうすると大量の Ajax リクエストが発生するからです。ただし、Enter ボタンを押す必要もありません。

ユーザーが入力を終了したことを検出し、Ajax リクエストを実行する方法はありますか?

ここで jQuery を使用します。

ベストアンサー1

入力を終了するということは、しばらく、たとえば 5 秒間停止することを意味すると思います。これを念頭に置いて、ユーザーがキーを放したときにタイマーを開始し、キーを押したときにタイマーをクリアしましょう。問題の入力は #myInput にすることにしました。

いくつかの仮定を立ててみます...

//setup before functions
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
}

おすすめ記事