1 var keyDom = document.getElementById('keyDom'); 2 //全局的一个变量,可被每次触发的事件函数重新修改赋值 3 var lastTimeStamp = 0; 4 keyDom.addEventListener('keyup',function(event){ 5 //标记当前事件函数的时间戳 6 lastTimeStamp = event.timeStamp; 7 //800ms后比较二者是否还相同(因为只要还有事件触发,lastTimeStamp就会被改写,不再是当前事件函数的时间戳) 8 setTimeout(function(){ 9 if(lastTimeStamp == event.timeStamp){ 10 alert('发送请求'); 11 }; 12 },800); 13 },false);
注释:
1.用户输入动作触发keyup事件,并调用事件函数。事件函数被调用后会生成对应的event.timeStamp,这个值在事件函数体内一直不会变。
2.将这个值复赋给全局中定义的lastTimeStamp。这个lastTimeStamp是一个全局的变量,这样这个值在每次事件触发时都会被改变。
3.如果在1000ms内,lastTimeStamp这个值被其他事件函数重新赋值修改,(同函数因触发事件被调用多次)则lastTimeStamp != event.timeStamp;说明还在输入。不走ajax请求。
4.若1000ms内不再触发事件,不再调用事件函数。
5.lastTimeStamp被本次事件函数赋值一次后,没有再被改写。则说明,此时不再输入或有间歇。lastTimeStamp==event.timeStamp。发送ajax请求