今天遇到一个很有意思的问题,就是做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事件累加解决方法