检测元素出现方法。
虽然是基于 jQuery 的,但是代码很简洁,可以修改成纯js版的。

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();

jQuery下实现检测指定元素加载完毕的更多相关文章

  1. jQuery下实现等待指定元素加载完毕

    先声明下这个方法的使用场合,以免误导大家..比如在博客园,我们没法修改他的源代码,那么只能想办法监视元素的出现了.所以下面方法是在修改不了源码的情况下使用,而非写自己的项目.. 今天在改博客几个样式的 ...

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

    http://www.poluoluo.com/jzxy/201307/233374.html 代码如下: jQuery.fn.wait = function (func, times, interv ...

  3. python selenium等待特定网页元素加载完毕

    selenium等待特定元素加载完毕 is_disappeared = WebDriverWait(driver, 8, 0.5, ignored_exceptions=TimeoutExceptio ...

  4. jQuery学习(监听DOM加载)

    jQuery的extend方法 function njQuery() { } /* njQuery.extend = function (obj) { // 此时此刻的this就是njQuery这个类 ...

  5. jQuery页面加载完毕事件及jQuery与JavaScript的比较

    1.jQuery概述 jQuery是一个JavaScript库,它集成了JavaScript.DOM.CSS和Ajax,简化了JavaScript编程,提倡write less, do more. 2 ...

  6. HTML页面加载完毕后运行的js

    Js方法:<script type=”text/javascript”> window.onload=function (){ var userName=”xiaoming”; alert ...

  7. jQuery 滚动条 滚动到底部(下拉到底部) 加载数据(触发事件、处理逻辑)、分页加载数据

    1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...

  8. jQuery WeUI 组件下拉刷新和滚动加载的实现

    最近在做手机版使用到了下拉刷新和滚动加载,记录一下实现过程: 一.引入文件 ? 1 2 3 4 <link rel="stylesheet" href="Conte ...

  9. jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据

    jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...

随机推荐

  1. Impala 3、Impala、Hbase整合

    Impala可以通过Hive外部表方式和HBase进行整合,步骤如下: • 步骤1:创建hbase 表,向表中添加数据 create 'test_info', 'info' put 'test_inf ...

  2. Unity Scene为每一个游戏物体进行扩展编辑

    2个月前还在忙碌的找实习工作,看见招聘信息上面有一条熟悉扩展Unity编辑器,配合美工编程. 自己动手写完这个代码时候,发现写代码就像弹钢琴多么神奇. TestEdit类: using UnityEn ...

  3. SQL With(递归 CTE 查询)

    本文来自:http://www.cnblogs.com/smailxiaobai/archive/2012/01/16/2323291.html 指定临时命名的结果集,这些结果集称为公用表表达式 (C ...

  4. B. Sereja and Mirroring

    B. Sereja and Mirroring time limit per test 1 second memory limit per test 256 megabytes input stand ...

  5. Elasticlunr.js 简单介绍

    Elasticlunr.js 项目地址:http://elasticlunr.com/ 代码地址:https://github.com/weixsong/elasticlunr.js 文档地址:htt ...

  6. Linux下 输入 env 而得到的环境变量解读

    HOSTNAME=Master.Hadoop MAHOUT_HOME=/usr/hadoop/mahout-distribution-0.8 TERM=linux SHELL=/bin/bash HA ...

  7. 实现android4.4新特性:沉浸式状态栏

    先放效果图: 所谓沉浸式状态栏,就是android4.4以后新加入的ui效果,能使最顶部的状态栏自动适宜app顶部的颜色,使两者看起来更像融为一体.下面放上实现代码: requestWindowFea ...

  8. 冒泡排序 选择排序 插入排序希尔排序 java

    双向冒泡 package com.huang; public class _014_bubb_sort { int[] b={1,2}; static int a[]={12,4,35,65,43,6 ...

  9. 学习asp.net比较完整的流程

    如果你已经有较多的面向对象开发经验,跳过以下这两步: 第一步 掌握一门.NET面向对象语言,C#或VB.NET 我强烈反对在没系统学过一门面向对象(OO)语言的前提下去学ASP.NET. ASP.NE ...

  10. linux操作系统下的码农常用工具

    IDE: Pycharm PHPStorm Zend Studio 文本编辑器: VIM Sublime Text 版本管理: svn RapidSVN git git ui 文件对比: Meld D ...