快捷導(dǎo)航

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.fzitv.net/article/25481.htm
Window.setTimeout
http://www.fzitv.net/article/20741.htm
以下是我用到的一些例子。

復(fù)制代碼代碼如下:

 
//延遲查詢，傳一個查詢btn的ID，然后根據(jù)它附近的FORM綁定，當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)文章

微信小程序功能之全屏滾動效果的實現(xiàn)代碼
最近小編做項目遇到這樣的需求，要求實現(xiàn)一個全屏滾動的效果，在網(wǎng)上找了實例代碼，但是不是很完美，小編又結(jié)合自己的知識給大家補充下，對微信小程序全屏滾動效果的實例代碼感興趣的朋友參考下本文吧
2018-11-11
一文概述ES7~12的語法及其相關(guān)使用規(guī)則
隨著JavaScript這門語言越來越流行，使得JavaScript這門語言越來越完善，這篇文章主要介紹了一文概述ES7~12的語法及其相關(guān)使用規(guī)則，需要的朋友可以參考下
2023-01-01
極品源碼：自動完成仿163篇
極品源碼：自動完成仿163篇...
2007-07-07
Base64(二進制)圖片編碼解析及在各種瀏覽器的兼容性處理
這篇文章主要介紹了Base64(二進制)圖片編碼解析及在各種瀏覽器的兼容性處理,需要的朋友可以參考下
2017-02-02
基于JQuery模仿蘋果桌面的Dock效果(初級版)
新的一天新的開始，今天要分享的是用JQuery模仿蘋果操作系統(tǒng)桌面的Dock效果，之所以稱之為初級版，是因為其中還有一些bug，顯示效果并不穩(wěn)定
2012-10-10
微信小程序?qū)崿F(xiàn)登錄遮罩效果
這篇文章主要為大家詳細介紹了微信小程序?qū)崿F(xiàn)登錄遮罩效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2018-11-11
JS實現(xiàn)定時自動消失的彈出窗口
這篇文章介紹了JS實現(xiàn)定時自動消失的彈出窗口，文中通過示例代碼介紹的非常詳細。對大家的學(xué)習或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2022-04-04
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作用域與作用域鏈使用重點講解
當代碼在一個環(huán)境中執(zhí)行時,會創(chuàng)建變量對象的一個作用域鏈,作用域鏈的用途是保證對執(zhí)行環(huán)境有權(quán)訪問的所有變量和函數(shù)的有序訪問,下面這篇文章主要給大家介紹了關(guān)于JavaScript作用域與作用域鏈的相關(guān)資料,需要的朋友可以參考下
2022-10-10