监控一段时间没输入可用于简单的输入完成


上次实现了一个模拟输入完成则发送请求到后台获取数据的并显示到前台的问题,其中核心的判断标准是输入完成的定义。

即:用户怎么算输入完成。

我使用的标准是,当一个文本框中,里面的内容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。

jQuery 监控键盘一段时间内没输入的更多相关文章

  1. jQuery监控键盘事件

    <!doctype html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  2. 利用zabbix API 统计一段时间内监控项的均值和峰值

    #coding:utf-8 #给定主机IP获取一段时间内cpu的均值和峰值并写入文件(txt,可以跑完后直接把后缀名改为csv以表格形式打开):需要指定IP文件 import requests imp ...

  3. JQuery识别键盘操作 & 键盘快捷键

    前几天写的那个项目登陆页是直接点击but登陆的,后来做完了之后不断的测试的时候就发现蛋疼之处了 每次在键盘上输入一长串密码之后,还得抬起手拿鼠标点一下确认登陆 直接就搜了一下,看了一下书 = = 其实 ...

  4. HTML界面监控键盘回车Enter按下并绑定动作

    本示例绑定键盘回车键(Enter),触发发送WebSocket消息动作 <script type="text/javascript"> //监控键盘Enter 回车键按 ...

  5. wpf 判断鼠标在一段时间内是否移动

    原文:wpf 判断鼠标在一段时间内是否移动 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/config_man/article/details/74 ...

  6. jQuery模拟键盘打字逐字逐句显示文本

    jQuery模拟键盘打字逐字逐句显示文本 html代码 <!doctype html> <html lang="zh"> <head> < ...

  7. storm入门(二):关于storm中某一段时间内topN的计算入门

    刚刚接触storm 对于滑动窗口的topN复杂模型有一些不理解,通过阅读其他的博客发现有两篇关于topN的非滑动窗口的介绍.然后转载过来. 下面是第一种: Storm的另一种常见模式是对流式数据进行所 ...

  8. 一段时间没上来了,看到有很多网友对OWA感兴趣,因为所在公司发展方向的原因,没有太多时间继续深入研究OWA,敬请见谅

    一段时间没上来了,看到有很多网友对OWA感兴趣,因为所在公司发展方向的原因,没有太多时间继续深入研究OWA,敬请见谅

  9. Find命令搜索过去一段时间内修改过的文件

    Find命令搜索过去一段时间内修改过的文件 服务器  kxjhwbb  12个月前 (10-22)  342℃  0评论 有些时候我们需要查找一些最近修改过的文件,比如改着改着忘了自己改过什么= = ...

随机推荐

  1. mysql创建表与索引

    -- ---------------------------- -- 商品属性表 -- AUTO_INCREMENT=1为设置了自增长的字段设置起点,1为起点 -- ENGINE选择:MyISAM类型 ...

  2. NeHe OpenGL教程 第十九课:粒子系统

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

  3. php之面向对象

    <?php declare(encoding='UTF-8'); class Site{ /*成员变量*/ var $url; var $title = "gunduzi" ...

  4. unsigned char 转字符串:

    通常送显示的都是字符串,对于int long float转字符串有对应的函数,还有sprintf进行格式输出,对于嵌入式和单片机大多都用unsigned char型变量,转字符串需要自己编写函数,需要 ...

  5. 常见的http头信息

    请求头:用于告诉服务器,客户机支持的数据类型 accept-charset:用于告诉服务器,客户机采用的编码 accept-Encoding:用于告诉服务器,客户机支持的数据压缩格式 Host:客户机 ...

  6. 离线使用echarts及一些细节

    最近要做图表,用js起来太麻烦,所以就找些开源的库来用,发现echarts挺不错, echarts的文档把所有东西都说的很明白了,直接下载zip包,要是想离线使用的话只需要引用下载包里面的dist文件 ...

  7. [Flex] Accordion系列-Header的运用

    <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="ht ...

  8. Delphi的内存管理及内存泄露问题 FastMM4

    这几天因为一个程序长时间运行出现比较严重的内存泄露问题,开始关注了一下内存管理方面的东西,以前也注意内存管理,创建了对象及时释放,但总有忘了处理的情况. 在Delphi中没有自动回收机制,所以一定要及 ...

  9. 全新安装Mac OSX 开发者环境 同时使用homebrew搭建 PHP,Nginx ,MySQL,Redis,Memcache ... ... (LNMP开发环境)

    https://segmentfault.com/a/1190000000606752

  10. 剑指offer习题集

    1.重载赋值运算符函数:(具体见代码) //普通做法 CMyString& CMyString::operator=(const CMyString& str) { if (this ...