jquery的click事件累加解决方法

今天遇到一个很有意思的问题,就是做jquery click嵌套的时候,容易出现累加的情况即click事件重复执行的问题,比如:

<script type=’text/javascript’ src=’http://www.cnonepiece.com/wp-content/themes/xiu/js/jquery.js?ver=1.1′></script>
<script>
$(document).ready(function() {
$(“#btn1”).click(function(){

$(“#btn2”).click(function(){

alert(“hi”);

});

});
});
</script>

<input id=”btn1″ type=”button” value=”button1″ > <input id=”btn2″ type=”button” value=”button2″ >

点击一下 button1然后再点击一下 button2,会alert一下“hi”,如果此时再点击一下 button1、  button2,就会连续弹出两次“hi”。以此类推。这种现象就是click事件累加现象。如果我们只想每次点击一遍 button1、  button2都只弹一次“hi”,那我们只需要在每次的click时间之前解绑一次click:unbind(‘click’)。

<script>
$(document).ready(function() {
$(“#btn1”).click(function(){
$(“#btn2”).unbind(‘click’);
$(“#btn2”).click(function(){

alert(“hi”);

});

});
});
</script>

这样每次点击就会只弹一次hi。

 

未经允许不得转载:前端撸码笔记 » jquery的click事件累加解决方法

上一篇:

下一篇: