解决jquery中事件重复绑定问题

一$.fn.live 重复绑定

解决:使用die()方法,在live()方法绑定前,将此元素上的前面被绑定的事件统统解除,然后再通过live()方法绑定新的事件。

//先通过die()方法解除,再通过live()绑定

$(“#selectAll”).die().live(“click”,function(){

//事件运行代码

});

二click等事件

解决:使用unbind(“click”)方法先解除绑定的事件再绑定新事件,即在给对象绑定事件之前先移除该对象上的原有事件

完整测试代码:

<div class="box">

    <button id="test">重复绑定触发按钮</button>(点击此按钮两次及以上,即可触发重复绑定,再点击下面的按钮就可看到结果)

    <br/><br/>

    <button id="test1">click重复绑定测试按钮</button>

    <button id="test2">click绑定一次测试按钮</button>

    <button id="test3">live重复绑定测试按钮</button>

    <button id="test4">live绑定一次测试按钮</button>

</div>

<script type="text/javascript" src="../static/jquery-1.6.1.min.js"></script>

<script type="text/javascript">

    $(function(){

var i = 1,j=1,k=1,h=1,n=1;

var triggerBind = function(){

    $("#test1").click(function() {

alert("click未解除绑定重复绑定执行第" + j++ + "次");

    });

    $("#test2").unbind('click').click(function() {

alert("click解除绑定执行" + k++ + "次");

    });

    

    $("#test3").live("click",function() {

alert("live未解除绑定重复执行第" + h++ + "次");

    });

    $("#test4").die().live("click",function() {

alert("live解除绑定后执行" + n++ + "次");

    });

}

$("#test").click(function() {

    triggerBind();

    alert("触发绑定点击第" + i++ + "次");

});

    });

</script>

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索对象
, 测试
, 代码
事件
jquery重复绑定事件、jquery 绑定click事件、jquery动态绑定事件、jquery 绑定事件、jquery取消绑定事件,以便于您获取更多的相关知识。

时间: 2025-01-29 10:44:26

解决jquery中事件重复绑定问题的相关文章

jquery事件重复绑定的快速解决方法

 本篇文章主要是对jquery事件重复绑定的快速解决方法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 一 $.fn.live 重复绑定   解决:使用die()方法,在live()方法绑定前,将此元素上的前面被绑定的事件统统解除,然后再通过live()方法绑定新的事件.   代码如下: //先通过die()方法解除,再通过live()绑定 $("#selectAll").die().live("click",function(){ //事件运行代码 })

解决jquery中动态新增的元素节点无法触发事件问题的两种方法_jquery

比如做一个ajax读取留言列表的时候,每条留言后面有个回复按钮,class为"reply",如果你用的是$(".reply").click(function(){ //do something... }),想必后面通过ajax加载进来的列表中的回复按钮,点击事件会失效. 其实最简单的方法就是直接在标签中写onclick="",但是这样写其实是有点low的,最好的方式还是通过给类名绑定一个click事件. 解决jquery中动态新增的元素节点无法触

jquery中取消和绑定hover事件的实现代码_jquery

在网页设计中,我们经常使用jquery去响应鼠标的hover事件,和mouseover和mouseout事件有相同的效果,但是这其中其中如何使用bind去绑定hover方法呢?如何用unbind取消绑定的事件呢? 一.如何绑定hover事件 先看以下代码,假设我们给a标签绑定一个click和hover事件: $(document).ready(function(){ $('a').bind({ hover: function(e) { // Hover event handler alert("

jquery中事件委派代码分析以及jQuery中delegate和on的用法与区别详细解析

jquery中事件委派我们会使用到delegate与live方法了,下面我就以delegate与live方法为例子给各位分析一下jquery 事件委派的例子吧,希望例子能帮助到各位朋友. 什么是jquery中的事件委派? 在jquery中有一个很重要的概念--事件委派,相信很多搞前端开发的人都听说过,零度逍遥本来对此不是十分理解,但经过一个高人的指点后,才发现这个功能还是蛮强大的,今天就给大家分享一下. 事件委派的定义就是,把原来加给子元素身上的事件绑定在父元素身上,就是把事件委派给父元素. 说

解决jquery中美元符号命名冲突问题

 在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,下面为大家介绍下如何解决jquery中美元符号命名冲突问题 在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法.然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突.下面以引入两个库文件 jquery.js和prototype.js为例来进行说明.   

jQuery中事件与动画的总结分享_jquery

1.加载DOM 1.1.window事件 window.onload=function(){}.... 时机:其他资源都加载完毕后,再执行 $(function(){}) --:只是等待标签完毕,即可执行 区别:前者在HTML页面中只能解析最后一个,二后者是N个 window.onload() = function () { } $(function () { $("li").bind("click", function () { $(this).css("

jQuery的事件预绑定_jquery

1. 预绑定 首先解释一下什么叫预绑定.预绑定,顾名思义,就是在Web页面上的控件还没出现之前就绑定好事件.预绑定主要是指jQuery中的.on()方法. 2. Demo HTML代码 <div id="root"> <input type="button" id="test" value="test"/> </div> 一般的jQuery代码: $('#root').find('#test

解决数据库中记录重复问题

解决|数据|数据库|问题|重复 解决数据库中记录重复问题 (By:aloxy) Jul 22, 11:19 --产品数据重复统计SELECT mc, userid, COUNT(mc) AS Expr1FROM chanpinGROUP BY mc, userid--将不重复的纪录插入新表newchanpinselect * into #Tmp1 from chanpingoselect min(ID) as autoID into #Tmp2 from #Tmp1 group by mc, u

APS.NET和MVC3解决jQuery中Ajax的乱码问题

encodeURIComponent() 函数可把字符串作为 URI 组件进行编码. 转自http://blog.csdn.net/allsharps/article/details/6875419 解决jQuery中Ajax的乱码问题   $(document).ready(function(){   //    alert(encodeURI("我"));       $.ajax({url:"a.php?a=" + encodeURIComponent(&qu