jQueryAjax模拟按键消抖(可设置抖动延迟时间)
在硬件中,按键等都会有抖动现象,如何消除抖动,不重复触发事件呢,这就要用到消抖机制了.
这是我用jQuery模拟硬件消抖原理,额,可能是吧...又不对的地方,希望有高手指点指点.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>ajax消抖Demo</title>
<script type="text/javascript" src="js/jquery-2.0.0.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css"> <script type="text/javascript">
$(function() {
var i = 1; // 计时器计时次数
var firstClick = true;
var _interval; $("input").click(function(){ // 模拟按键抖动,假定抖动延迟为1s.则1s内所有按键都判定为一次按键请求
if (i != 1) {
firstClick = false;
} else{
firstClick = true;
}
_interval = setInterval(myTimer, 200); // 计时开始
if (firstClick) { // 按键未抖动,ajax执行
$(this).val("ajax中,请骚等...")
// 模拟ajax网络延时,假设为4s,延时过程中,用户不能再次发起ajax请求
var test = setTimeout(function(){
myAjax()
},4000);
} else{ // 按键抖动中,取消ajax
//$(".msgBtn").css('display', 'block');
alert("111");
return ;
};
}); function myAjax() {
$(".msg").css({
height: '160px'
});
$(".msg").load("test.html", function() {
$("input").val("ajax done!");
});
// ajax success
} // 计时器
function myTimer() {
i++;
if (i > 5)
{
i = 1;
$(".msgBtn").css('display', 'none');
clearInterval(_interval);
}
}
});
</script>
</head>
<body style="text-align:center;">
<input type="button" value="ajax" />
<div class="msgBtn" style="display:none">上次按键抖动中...</div>
<div class="msg">userInfo</div>
</body>
</html>
这是ajax请求test.html文件:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
</head>
<body>
<h3 align="left">userInfo:</h3>
<table id="teble1" border="1" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="100px">Name:</td>
<td width="100px">cxs</td>
</tr>
<tr>
<td width="100px">Sex:</td>
<td width="100px">boy</td>
</tr>
<tr>
<td width="100px">Age:</td>
<td width="100px">24</td>
</tr>
</table>
</body>
</html>
抖动延迟时间可以自由设置,抖动过程中用户再次点击的话判定为上一次点击,也就是一段时间内用户所有的点击都判定为一次触发点击事件.
jQueryAjax模拟按键消抖(可设置抖动延迟时间)的更多相关文章
- 09A-独立按键消抖实验01——小梅哥FPGA设计思想与验证方法视频教程配套文档
芯航线--普利斯队长精心奉献 实验目的: 1.复习状态机的设计思想并以此为基础实现按键消抖 2.单bit异步信号同步化以及边沿检测 3.在激励文件中学会使用随机数发生函数$random 4.仿真模 ...
- 09B-独立按键消抖实验02——小梅哥FPGA设计思想与验证方法视频教程配套文档
芯航线--普利斯队长精心奉献 实验目的: 1.复习按键的设计 2.用模块化设计的方式实现每次按下按键0,4个LED显示状态以二进制加法格式加1,每次按下按键1,4个LED显示状态以二进制加法格式减 ...
- FPGA学习笔记(八)—— 状态机设计实例之独立按键消抖
###### [该随笔中部分内容转载自小梅哥] ######### 独立按键消抖自古以来在单片机和FPGA中都是个不可避免的问题,首先,解释一下什么叫做按键抖动,如图,按键在按下和松开的那个瞬间存在大 ...
- 按键消抖——task任务和仿真平台搭建
一.按键抖动原理 按键抖动原理:按键存在一个反作用弹簧,因此当按下或者松开时均会产生额外的物理抖动,物理抖动会产生电平的抖动. 消抖方法:一般情况下,抖动的总时间会持续20ms以内,按下按键后,等20 ...
- 09自动售货机综设实验(含按键消抖,led和状态机)
一设计功能 1.上次状态机的练习 2这次自动售货机综设 (一)对比两次的售货机 上次售货机的关键是画出状态转移图.明确输入分几种,输出是啥,有哪些状态.如下图所示 (二)系统或综合设计的经验: 既然这 ...
- Verilog HDL那些事_建模篇笔记(实验三:按键消抖)
实验三:按键消抖 首先将按键消抖功能分成了两个模块,电平检查模块和10ms延迟模块.电平检测模块用来检测按键信号的变化(是否被按下),10ms延迟模块用来稳定电平检查模块的输入,进而稳定按键信号,防止 ...
- 按键消抖-----verilog
实际系统中常用的按键大部分都是轻触式按键,如下图所示.该按键内部由一个弹簧片和两个固定触点组成,当弹簧片被按下,则两个固定触点接通,按键闭合.弹簧片松开,两个触点断开,按键也就断开了.根据这种按键的机 ...
- 按键消抖VERILOG实现
对于消抖,有很多种写法.今天分享一下我的写法. 基本思路: 1. 看图 图1 ...
- 强化版按键消抖Verilog实现
介绍:按键的物理结构导致了会有抖动现象的出现,判断按键是否真正按下,需要把抖动的部分滤波.根据经验可知,抖动一般在20ms内,所以常规的消抖方法是从变化沿出现时刻开始,延时20ms后判断按键的状态.这 ...
随机推荐
- fork()调用使子进程先于父进程被调度
由于内核使用写时复制机制,fork之后父子进程是共享页表描述符的,如果让父进程先执行,那么有很大几率父进程会修改共享页表指向的数据,那么内核此时必须给父进程分配并复制新的页表供父进程修改使用,那么如果 ...
- 关于read和fread
1.fread与read的区别---open和fopen的区别--fread函数和fwrite函数:http://blog.csdn.net/dreamtdp/article/details/7560 ...
- Android第三方开源图片裁剪截取:cropper
Android第三方开源图片裁剪截取:cropper 很多app都需要裁剪截取图片作为头像.logo之类,而cropper是github上的一个针对Android平台的.第三方开源图片裁剪截取项 ...
- [poj2396]Buget[上下界可行流]
题意:有一个n*m的方阵,里面的数字未知,但是我们知道如下约束条件:每一行的数字的和每一列的数字的和某些格子有特殊的大小约束,用大于号,小于号和等于号表示问:是否存在用正数填充这个方阵的方案,满足所有 ...
- [bzoj4282]慎二的随机数列_动态规划_贪心
慎二的随机数列 bzoj-4282 题目大意:一个序列,序列上有一些数是给定的,而有一些位置上的数可以任意选择.问最长上升子序列. 注释:$1\le n\le 10^5$. 想法:结论:逢N必选.N是 ...
- Java端百度云推送消息Demo
因为在做Java服务器有用到推送消息机制,于是到网上找了一下,就自己试着敲了一个demo.这个demo主要是简单的一个对app消息推送. jar:百度云消息推送Java端的jar. package x ...
- www.pgcon.org 文档
https://www.pgcon.org/2016/schedule/attachments/ https://www.pgcon.org/2015/schedule/attachments/ ht ...
- ddl in PL/SQL
If you write DDL directly in PL/SQL. You will hit error. 1 DECLARE 2 str_sql varchar2(500); 3 begin ...
- 在centos7上安装DSPC
感谢朋友支持本博客.欢迎共同探讨交流,因为能力和时间有限.错误之处在所难免,欢迎指正! 假设转载,请保留作者信息. 博客地址:http://blog.csdn.net/qq_21398167 原博文地 ...
- [iOS]怎样在iOS开发中切换显示语言实现国际化
1.在Project设置,加入中英两种语言: 2.新建Localizable.strings文件,作为多语言相应的词典,存储多种语言,点击右側Localization,勾选中英: watermark/ ...