jQuery monitors the keyboard for a period of time without input

jQuery monitors the keyboard for a period of time without input_jquery

WBOY

Release： 2016-05-16 15:04:19

Original

1601 people have browsed it

Monitoring no input for a period of time can be used to complete simple input

Last time, we implemented a problem of sending a request to the background to obtain data when the simulated input is completed and displaying it to the front desk. The core judgment criterion is the definition of input completion.

That is: how does the user count the input as completed.

The standard I use is that when the content in a text box does not change for 1 second, it means that the user has not input within 1 second, indicating that the user has completed the input and is waiting for the return data. So how does jQuery determine if there is no input within 1 second.

<!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>

Copy after login

Principle

This is such a concise piece of code. Its principle can be briefly described as follows:

Every time the user presses the keyboard, the current time is recorded, and then the time is judged after 1 second.

Since lastTime is a global variable, lastTime is always changing when the user is typing, so if you use lastTime-e.timeStamp after one second, only the last e.timeStamp pressed will be 0. .