HTML5 入力のリアルタイム検出と遅延の最適化

入力ボックスがリアルタイムで入力を監視し、リクエストをトリガーするプロジェクトがあります。

最初のアイデアは、入力で onchange() メソッドを使用することです。試してみましたが、値の変更が確認された後にのみトリガーされ、即時ではありません。

ネットで調べたのですが、

 $(#fix).on('input propertychange', function(event){});

このメソッドは機能しますが、リアルタイムで変更されます。送信頻度は少し早いです。

急いでタイマー setTimeout を追加します。

 $(#fix).on('input propertychange', function(event){ setTimeout(function(){ //実行までに 0.5 秒遅延します console.log($(#fix).val()) },500); } );

問題は再び発生します。タイマーは遅延していますが、変更せずに実行されます。

その後、バインドを解除してバインドしようと考えましたが、バインド解除中にキーボード入力イベントが取得できませんでした。

当時の最初のアイデアは、イベントをトリガーする - タイマーを削除する - タイマーを追加する - 関数を実行するというものでした。それでもダメでタイマーを削除できないことがわかったので、単純に実行を中止しました。

結局、ネットで調べたら新しい方法を見つけました。

タイムスタンプ方式。

原則として、グローバル変数とタイムスタンプが入力によって変更されるたびに、新しいタイムスタンプが 0.5 秒の遅延で監視され、バインドされたタイムスタンプと等しくなって、次のステップに進みます。

-----html-----

 <input type=text id=fix>-----script-----var last;$(#fix).on('input propertychange', function(event){ //#fix はあなたのものですinput Box last =event.timeStamp; //各イベントが last の値を変更するように、イベントの timeStamp を使用します。 setTimeout(function(){ //遅延時間を 0.5 に設定します。 s を実行するには if(last -event.timeStamp==0) //時間差が 0 の場合 (つまり、入力を停止してから 0.5 秒以内に他のキーアップ イベントが発生しない場合)、必要なことを実行します { console.log($(#fix).val()) } } 、500);});

上記は、編集者が紹介した HTML5 入力のリアルタイム検出と遅延の最適化です。ご質問があれば、メッセージを残してください。編集者がすぐに返信します。また、VeVb武道サイトを応援してくださった皆様、誠にありがとうございました！