jQuery 监控键盘一段时间没输入
2016-04-22 14:13
741 查看
监控一段时间没输入可用于简单的输入完成
上次实现了一个模拟输入完成则发送请求到后台获取数据的并显示到前台的问题,其中核心的判断标准是输入完成的定义。
即:用户怎么算输入完成。
我使用的标准是,当一个文本框中,里面的内容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是一直在变化的,所以一秒后再用lastTime-e.timeStamp,只有最后按下的e.timeStamp那一次才会为0。
您可能感兴趣的文章:
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- JavaScript演示排序算法
- 2015-2016网页设计趋势分析 Web Design of Trends
- jQuery Ajax 跨域调用
- 移动端的长按事件
- jquery教程靠边站,一分钱不花让你免费学会jquery
- JQuery+Strusts1.x无刷新登录
- $.ajax()方法详解
- jQuery ajax - ajax() 方法
- 在 Linux 下交换 Ctrl 与大写锁定键
- 使用zabbix监控Nginx活动状态--Part1
- JavaScript 各种遍历方式详解
- 数组方法汇总
- 输入法的一些小技巧
- jQuery Html控件基本操作(日常收集整理)
- jQuery插件实现文字无缝向上滚动效果代码
- jQuery菜单插件用法实例
- JQuery 初体验(建议学习jquery)
- 基于Jquery和CSS3制作数字时钟附源码下载(CSS3篇)
- Jquery实现的table最后一行添加样式的代码