zoukankan      html  css  js  c++  java
  • 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(); 
    但是后来想想,元素都没加载,继续链下去也没意义,不过算了,不改了,就这样吧。呵呵 :-) 

  • 相关阅读:
    11.2~11.8 每周总结
    11.30~11.6 每周总结
    架构之美 图书笔记 03
    每周总结 10.26-11.1
    每周总结 10.19-10.25
    每周总结 10.12-10.18
    [Tips] centos下docker服务开机自启动
    [Notes] Linux内网穿透
    [Tips] python 文件读写
    [Tips] python 文件读写
  • 原文地址:https://www.cnblogs.com/jcz1206/p/5138380.html
Copyright © 2011-2022 走看看