JQuery中bind和unbind函数转载:   https://blog.csdn.net/liucheng417/article/details/51131982

页面代码:

<body>
<input type="button" name="aaa" value="点击我">
<input type="checkbox" name="checkbox1">
</body>

JQuery代码:

$().ready(function(){
 　　for (var i = 0; i < 3; i++) {
 　　　　 $("input[type='button']").click(function(){
   　　　　alert("aaaa");
 　　　　 });
 　　}
}

执行结果：alert("aaaa")会执行三次。在事件嵌套事件中，不希望看到这样的情况，需要把上层事件禁用，此时可引入bind和unbind函数解决。

JQuery引入函数:

for (var i = 0; i < 3; i++) {

　　$("input[type='button']").unbind("click");
　　$("input[type='button']").bind("click", function(){

　　//上面两句等价于$("input[type='button']").unbind("click").bind("click", function(){
　　alert("aaa");
　　});
}

执行结果：alert("aaa");仅执行一次。

与onclick区分

业务场景：

当需对某个按钮添加单击事件，为了控制重复点击，需点击完后立马去掉单击事件。

$(function(){
　　$('#btn').bind('click', aa);
});

function aa(){

　　$("#btn").unbind("click");

　　...

　　//在需要重新绑定点击事件时

　　$('#btn').bind('click', aa);

}

优点：基本兼容所有浏览器

做法2：

在button按钮上添加onclick事件。

点击onclick后调用aa()方法。

function aa(){

$("#btn").removeAttr("onclick");

...

//在需要重新绑定点击事件时

$("#btn).attr("onclick“,"aa()");

}

缺点：在IE7及以下不兼容。

JQuery中bind和unbind函数与onclick绑定事件区分的更多相关文章

  1. jQuery中如何给动态添加的元素绑定事件

    jquery中绑定事件一般使用bind,或者click,但是这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定.在1.7版本以前使用live.但是在1.8版本以后推荐使用on.这 ...

  2. JQuery 的bind和unbind函数

    测试:页面代码:<body>     <input type="button" name="aaa" value="点击我" ...

  3. Jquery中bind(), live(), on(), delegate()四种注册事件的优缺点，建议使用on（）

    jquery中注册的事件,注册事件很容易理解偏差,叫法不一样.我第一反应就是如何添加事件,使用onclick之类的,暂时不讨论js注册事件的方法. 也看到园内前辈写过相关的帖子,但不是很详细,我找到了 ...

  4. jQuery中bind方法和live方法区别解析

    Javascript中的事件有它的独特性,有默认的执行事件,例如冒泡就是其中的一个.在很多比较复杂的应用程序中,停止事件的冒泡或捕获在程序开发当中是十分有用的,而在IE中有它的独特方式来阻止事件的冒泡 ...

  5. jquery中attr()与prop()函数用法实例详解(附用法区别)

    本文实例讲述了jQuery中attr()与prop()函数用法.分享给大家供大家参考,具体如下: 一.jQuery的attr()方法 jquery中用attr()方法来获取和设置元素属性,attr是a ...

  6. jquery 中 html与text函数的区别

    jquery 中 html与text函数的区别 共同点:它们都能讲函数中的参数渲染到页面中: 异同点: text() 只是简单的讲参数的内容写入到页面中: html() 会根据参数的值,判断是否字体符 ...

  7. es6 Object.assign ECMAScript 6 笔记（六） ECMAScript 6 笔记（一） react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式

    es6 Object.assign   目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...

  8. jquery中动态新增的元素节点无法触发事件解决办法

    在使用jquery中动态新增的元素节点时会发现添加的事件是无法触发的,我们下面就为各位来详细的介绍此问题的解决办法． 比如做一个ajax读取留言列表的时候,每条留言后面有个回复按钮,class为“re ...

  9. js进阶---12-11、jquery如何给动态创建出来的元素绑定事件

    js进阶---12-11.jquery如何给动态创建出来的元素绑定事件 一.总结 一句话总结:通过事件委托的方式,通过on方法 1.on方法在事件绑定的时候,data方式带额外参数时,字符串参数和其它 ...

随机推荐

  1. 集合--（List、Set、Map）遍历、删除、比较元素时的小陷阱

    6,Map集合遍历的4中方法? 5,List遍历时如何remove元素 4.漏网之鱼-for循环递增下标方式遍历集合,并删除元素 如果你用for循环递增下标方式遍历集合,在遍历过程中删除元素,你可能会 ...

  2. 20165312 预备作业3 Linux安装及学习

    Linux安装及学习 一.安装Vmware虚拟机以及Ubuntu中遇到的问题 因为之前安装过Vmware虚拟机,考虑到两者没有太大的差别,就所以就没有再安装Vbox虚拟机. 在安装Vmware虚拟机增 ...

  3. MySQL之 Mysqldump导出数据库

    参数大全 参数说明 --all-databases , -A 导出全部数据库. mysqldump -uroot -p --all-databases --all-tablespaces , -Y 导 ...

  4. U3d学习001-RollBox例子

    1.世界坐标系和局部坐标系(参照物坐标系)——以参照物为父物体节点  2.刚体组件:       获得GetComponent<Rigidbody>();     移动AddForce(n ...

  5. Python的多态、继承与封装

    一.多态 不用知道变量所引用的对象类型,还是能对它进行操作,它会根据对象(或类)的类型不同而表现出不同的行为. def run_twice(animal): animal.run() animal.r ...

  6. sbt 以及 IDEA sbt 插件安装配置教程(转)

    1. 在Windows中安装sbt 下载 官网: http://www.scala-sbt.org/ github: https://github.com/sbt/sbt/releases/downl ...

  7. 配置MySQL GTID(Global Transaction IDs)复制

    一.GTID的简介 1.GTID的概述 .全局事物标识:global transaction identifieds. .GTID事物是全局唯一性的,且一个事务对应一个GTID. .一个GTID在一个 ...

  8. Postgresql ERROR: permission denied for relation app_info

    启用终端,: 进入mydb数据库:\c mydb 然后给当前数据库的角色赋予权限:GRANT ALL PRIVILEGES ON TABLE 表名  TO 角色名;

  9. Python的字典类型

    Python的字典类型为dict,用{}来表示,字典存放键值对数据,每个键值对用:号分隔,每个键值对之间用,号分隔,其基本格式如下: d = {key1 : value1, key2 : value2 ...

  10. Python-1 试玩OpenCV

    昨天同事说微信更新有跳一跳小游戏,便更新了玩一玩.至于抄袭不抄袭我不讨论,看玩法和色彩都很简洁.想用Python试试摄像头捕捉图像,然后分析距离每次都能跳到中心,有生物机械手指之类的再弄到树莓派上岂不 ...