JS頁面延遲執(zhí)行一些方法(整理)
更新時間:2013年11月11日 17:26:54 作者:
一般在JS頁面延遲執(zhí)行一些方法,本文整理了一些,大家可以嘗試操作下
一般在JS頁面延遲執(zhí)行一些方法。可以使用以下的方法
jQuery.delay()方法簡介
http://shawphy.com/2010/11/jquery-delay.html
jQuery中queue和dequeue的用法
http://www.dhdzp.com/article/25481.htm
Window.setTimeout
http://www.dhdzp.com/article/20741.htm
以下是我用到的一些例子。
//延遲查詢,傳一個查詢btn的ID,然后根據(jù)它附近的FORM綁定,當(dāng)FORM里面的控件被觸發(fā)或被輸入了就會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();
}
定義遮罩層,相隔一分鐘后關(guān)閉
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);
}
}
jQuery.delay()方法簡介
http://shawphy.com/2010/11/jquery-delay.html
jQuery中queue和dequeue的用法
http://www.dhdzp.com/article/25481.htm
Window.setTimeout
http://www.dhdzp.com/article/20741.htm
以下是我用到的一些例子。
復(fù)制代碼 代碼如下:
//延遲查詢,傳一個查詢btn的ID,然后根據(jù)它附近的FORM綁定,當(dāng)FORM里面的控件被觸發(fā)或被輸入了就會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();
}
定義遮罩層,相隔一分鐘后關(guān)閉
復(fù)制代碼 代碼如下:
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();
}
倒計時
復(fù)制代碼 代碼如下:
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);
}
}
相關(guān)文章
一文概述ES7~12的語法及其相關(guān)使用規(guī)則
隨著JavaScript這門語言越來越流行,使得JavaScript這門語言越來越完善,這篇文章主要介紹了一文概述ES7~12的語法及其相關(guān)使用規(guī)則,需要的朋友可以參考下2023-01-01
Base64(二進制)圖片編碼解析及在各種瀏覽器的兼容性處理
這篇文章主要介紹了Base64(二進制)圖片編碼解析及在各種瀏覽器的兼容性處理,需要的朋友可以參考下2017-02-02
javascript設(shè)置和獲取cookie的方法實例詳解
這篇文章主要介紹了javascript設(shè)置和獲取cookie的方法,結(jié)合實例形式較為詳細的分析總結(jié)了JavaScript操作cookie簡單實現(xiàn)數(shù)據(jù)存儲與讀取的相關(guān)技巧,需要的朋友可以參考下2016-01-01
JS封裝的自動創(chuàng)建表格的實現(xiàn)代碼
這篇文章主要介紹了JS封裝的自動創(chuàng)建表格的實現(xiàn)代碼的相關(guān)資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-06-06
JavaScript作用域與作用域鏈?zhǔn)褂弥攸c講解
當(dāng)代碼在一個環(huán)境中執(zhí)行時,會創(chuàng)建變量對象的一個作用域鏈,作用域鏈的用途是保證對執(zhí)行環(huán)境有權(quán)訪問的所有變量和函數(shù)的有序訪問,下面這篇文章主要給大家介紹了關(guān)于JavaScript作用域與作用域鏈的相關(guān)資料,需要的朋友可以參考下2022-10-10

