研究ノート-入力タグが検索ボックスとして使用されている場合のクエリの遅延

フロントエンド開発プロセスでは、次の要件が存在する場合があります。Baidu検索と同様に、入力タグを検索ボックスとして使用し、検索ボックスにコンテンツを入力して関連する結果をクエリします。

ここでは、入力ボックスのキーアップイベントが主に使用されます。

---

キーボードをクリックすると、キーアップイベントがトリガーされます。実際の開発プロセスでは、ajaxを介してデータをリクエストする必要があります。一度クリックした場合は、リクエストしてください。リクエストは頻繁に送信されるため、これはお勧めしません。

したがって、リクエストを送信する前に、検索コンテンツが入力されるのを待つ必要があります。

練習： 

var lastInput = null;  // 上一次输入的延迟
$('输入框input标签').on('keyup', function(event) {
    clearTimeout(lastInput);
	lastInput = setTimeout(() => {
        // 在你停止输入250ms后，发送请求
    }, 250)     
});

---

上記の方法では、Baidu検索と同じ効果が得られますが、入力中は、入力後に検索結果が表示されます。