ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery は input_jquery を使用せずに一定期間キーボードを監視します

jQuery は input_jquery を使用せずに一定期間キーボードを監視します

WBOY
WBOYオリジナル
2016-05-16 15:04:191633ブラウズ

一定期間入力がないことを監視すると、簡単な入力を完了できます

前回は、模擬入力が完了したらバックグラウンドにデータ取得リクエストを送信し、それをフロントに表示する問題を実装しました。中心となる判断基準は入力完了の定義です。

つまり、ユーザーはどのように入力を完了するかということです。

私が使用する基準は、テキストボックスの内容が1秒間変化しない場合、それはユーザーが1秒以内に入力を行わなかったことを意味し、ユーザーが入力を完了し、返信データを待っていることを示します。 。では、jQuery は 1 秒以内に入力がないかどうかをどのように判断するのでしょうか。

<!DOCTYPE html>
<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js"></script>
<script>
var lastTime;
$(function(){
$('#text1').keyup(function (e) {
lastTime = e.timeStamp;
setTimeout(function () {
if (lastTime - e.timeStamp == 0) {
alert("1秒内没再输入,可以发送查询");
}
}, 1000);
});
})
</script>
</head>
<body>
<input id="text1" type="text" value="" />
</body>
</html>

原則

これは非常に簡潔なコードです。その原理は次のように簡単に説明できます:

ユーザーがキーボードを押すたびに現在時刻が記録され、1秒後に時刻が判定されます。

lastTime はグローバル変数であるため、ユーザーが入力しているときに lastTime は常に変化します。そのため、1 秒後に lastTime-e.timeStamp を使用すると、最後に押された e.timeStamp のみが 0 になります。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。