jQuery下实现等待指定元素加载完毕(可改成纯js版)

http://www.poluoluo.com/jzxy/201307/233374.html

 

代码如下:

jQuery.fn.wait = function (func, times, interval) { 
var _times = times || -1, //100次 
_interval = interval || 20, //20毫秒每次 
_self = this, 
_selector = this.selector, //选择器 
_iIntervalID; //定时器id 
if( this.length ){ //如果已经获取到了，就直接执行函数 
func && func.call(this); 
} else { 
_iIntervalID = setInterval(function() { 
if(!_times) { //是0就退出 
clearInterval(_iIntervalID); 
} 
_times <= 0 || _times--; //如果是正数就 -- 

_self = $(_selector); //再次选择 
if( _self.length ) { //判断是否取到 
func && func.call(_self); 
clearInterval(_iIntervalID); 
} 
}, _interval); 
} 
return this; 
} 

使用方法当然也很简单，只有3个参数。 
func 是回调函数，就是当指定元素出现后就执行的函数。 
times 是检测次数，默认是-1，一直检测直到出现为止。 
interval 是检测间隔，默认 20 毫秒一次。 

我们修改下之前的代码 

.代码如下:

$("#btn_comment_submit").wait(function() { //等待#btn_comment_submit元素的加载 
this.removeClass("comment_btn").addClass("btn"); //提交按钮 
//这里的 this 就是 $("#btn_comment_submit") 
}); 

$("#widget_my_zzk").wait(function() { //等待#widget_my_zzk元素的加载 
$(".div_my_zzk").addClass("input-append"); //搜索框 
$(".btn_my_zzk").removeClass("btn_my_zzk").addClass("btn"); //搜索按钮 
}); 

是不是很简单、、 

当然，依然不破坏jQuery的链式结构，你依然可以 $("#id").wait(function(){}).hide(); 
但是后来想想，元素都没加载，继续链下去也没意义，不过算了，不改了，就这样吧。呵呵 :-)