JS页面延迟执行一些方法(整理)


Posted in Javascript onNovember 11, 2013

一般在JS页面延迟执行一些方法。可以使用以下的方法
jQuery.delay()方法简介
http://shawphy.com/2010/11/jquery-delay.html
jQuery中queue和dequeue的用法
https://3water.com/article/25481.htm
Window.setTimeout
https://3water.com/article/20741.htm
以下是我用到的一些例子。

//延迟查询,传一个查询btn的ID,然后根据它附近的FORM绑定,当FORM里面的控件被触发或被输入了就会500毫秒后模拟点击查询按钮 
var timeout; 
function searchTrigerInit(btnId){ 
var $form = $("#"+btnId).closest("form"); 
$form.find("input").not(".search_onblur").keyup(function(){ 
searchTriger(btnId); 
}); 
$form.find("input.search_onblur").blur(function(){ 
searchTriger(btnId); 
}); 
$form.find("input[type=checkbox]").change(function(){ 
searchTriger(btnId); 
}); 
$form.find("select").change(function(){ 
searchTriger(btnId); 
}); 
} 
function searchTriger(btnId){ 
if(timeout != null){ 
clearTimeout(timeout); 
} 
timeout = setTimeout("searchBtnClick('"+btnId+"')",500); 
} 
function searchBtnClick(btnId){ 
$("#"+btnId).click(); 
}

定义遮罩层,相隔一分钟后关闭
var hideTimeout; 
function showLayerMask(){ 
$layerMask = $(".layerMask"); 
if($layerMask.length == 0){ 
var div = ""; 
var width = document.body.clientWidth; 
var Height = document.body.scrollHeight; 
var img = "<img src='"+resourcePath+"/src/images/loading2.gif' />"; 
div += "<div class='layerMask' style='width:100%;height:" + Height + "px;'>"; 
div += img; 
div += "</div>"; 
var $body = $("body"); 
$body.prepend(div); 
} 
$layerMask.show(); 
//1分钟后取消 
hideTimeout = setTimeout(hideLayerMask,60000); 
} 
function hideLayerMask(){ 
if(hideTimeout != null){ 
clearTimeout(hideTimeout); 
} 
$layerMask = $(".layerMask"); 
$layerMask.hide(); 
}

倒计时
var emailTime = 30; 
function nextCanDo(){ 
$("#mailValidateCodeBtn").val(emailTime+"秒"); 
emailTime -= 1; 
if(emailTime ==0 ){ 
$("#mailValidateCodeBtn").val("重新获取验证码"); 
$("#mailValidateCodeBtn").attr("disabled",false); 
emailTime = 30; 
}else{ 
setTimeout("nextCanDo()",1000); 
} 
}
Javascript 相关文章推荐
跟我一起学写jQuery插件开发方法(附完整实例及下载)
Apr 01 Javascript
深入理解JavaScript系列(4) 立即调用的函数表达式
Jan 15 Javascript
解析jQuery的三种bind/One/Live事件绑定使用方法
Dec 30 Javascript
javascript 中__proto__和prototype详解
Nov 25 Javascript
jQuery EasyUI datagrid实现本地分页的方法
Feb 13 Javascript
Javascript单例模式的介绍和实例
Oct 08 Javascript
JS常见疑难点分析之match,charAt,charCodeAt,map,search用法分析
Dec 25 Javascript
bootstrap confirmation按钮提示组件使用详解
Aug 22 Javascript
说说AngularJS中的$parse和$eval的用法
Sep 14 Javascript
浅谈VueJS SSR 后端绘制内存泄漏的相关解决经验
Dec 20 Javascript
vue全局自定义指令-元素拖拽的实现代码
Apr 14 Javascript
React Native项目框架搭建的一些心得体会
May 28 Javascript
jquery 缓存问题的几个解决方法
Nov 11 #Javascript
JavaScript中检测变量是否存在遇到的一些问题
Nov 11 #Javascript
javascript自定义startWith()和endWith()的两种方法
Nov 11 #Javascript
javascript打印输出json实例
Nov 11 #Javascript
JS简单的图片放大缩小的两种方法
Nov 11 #Javascript
js全屏显示显示代码的三种方法
Nov 11 #Javascript
JavaScript获取多个数组的交集简单实例
Nov 11 #Javascript
You might like
PHP安装攻略:常见问题解答(二)
2006/10/09 PHP
深入理解PHP原理之错误抑制与内嵌HTML分析
2011/05/02 PHP
Windows下的PHP安装文件线程安全和非线程安全的区别
2014/04/23 PHP
php判断GIF图片是否为动画的方法
2020/09/04 PHP
php实现头像上传预览功能
2017/04/27 PHP
yii2中LinkPager增加总页数和总记录数的实例
2017/08/28 PHP
仅IE支持clearAttributes/mergeAttributes方法使用介绍
2012/05/04 Javascript
浅谈Javascript鼠标和滚轮事件
2012/06/27 Javascript
体验js中splice()的强大(插入、删除或替换数组的元素)
2013/01/16 Javascript
js动态添加删除,后台取数据(示例代码)
2013/11/25 Javascript
纯JS实现根据CSS的class选择DOM
2014/03/22 Javascript
jQuery提示插件alertify使用指南
2015/04/21 Javascript
jQuery+Ajax+PHP弹出层异步登录效果(附源码下载)
2016/05/27 Javascript
Bootstrap3 多选和单选框(checkbox)
2016/12/29 Javascript
JSON中key动态设置及JSON.parse和JSON.stringify()的区别
2016/12/29 Javascript
网页中右键功能的实现方法之contextMenu的使用
2017/02/20 Javascript
微信小程序 五星评分的实现实例
2017/08/04 Javascript
解决npm安装Electron缓慢网络超时导致失败的问题
2018/02/06 Javascript
[55:32]2018DOTA2亚洲邀请赛 4.4 淘汰赛 EG vs LGD 第二场
2018/04/05 DOTA
[01:07:47]Secret vs Optic Supermajor 胜者组 BO3 第一场 6.4
2018/06/05 DOTA
Python实现的下载网页源码功能示例
2017/06/13 Python
Python3使用xml.dom.minidom和xml.etree模块儿解析xml文件封装函数的方法
2019/09/23 Python
python随机生成库faker库api实例详解
2019/11/28 Python
python3实现从kafka获取数据,并解析为json格式,写入到mysql中
2019/12/23 Python
Python pip配置国内源的方法
2020/02/14 Python
python mysql 字段与关键字冲突的解决方式
2020/03/02 Python
利用Python如何画一颗心、小人发射爱心
2021/02/21 Python
信用社实习人员自我鉴定
2013/09/20 职场文书
办公室主任主任岗位责任制
2014/02/11 职场文书
运动会通讯稿150字
2014/02/15 职场文书
物业经理自我鉴定
2014/03/03 职场文书
政风行风建设整改方案
2014/10/27 职场文书
2014年党风廉政建设工作总结
2014/11/19 职场文书
龙门石窟导游词
2015/02/02 职场文书
工作态度不好检讨书
2015/05/06 职场文书
基于python定位棋子位置及识别棋子颜色
2021/07/26 Python