阻止多次触发click操作

参考

jQuery 中 click事件会累计绑定

例如下面代码：

aNode.click(function(){
　　bNode.click(function(){
　　　　console.log('haha');
　　});
});

如果把对bNode的点击事件绑定到aNode的点击事件里，那么每点击一次aNode就会绑定一次bNode，假设在点击bNode之前点击了3次aNode，那么点击bNode之后，控制台会出现三次haha。

因为jQuery中的click事件会累计绑定。

为了避免上述情况发生，有两种解决办法：

1. 应该避免把click事件绑定到其他的例如click,hover等事件中。

aNode.click(function(){
});
bNode.click(function(){
　　console.log('haha');
});

2. 如果必须把click事件绑定在其他的例如click，hover等事件中的话（例如需要用到其他作用域中的变量，尤其是存在listitem这种情况下），需要用到unbind事件

$dom.unbind('click');
$dom.bind('click',funciton(){
     console.log('hahhaha');
});

在线调试

只触发一次click

参考
对于只需要触发一次，随后就要立即解除绑定的情况，JQuery提供了一种简写方法——one()方法。one()方法可以为元素绑定处理函数。当处理函数触发一次后，立即被删除。即在每个对象上，事件处理函数只会被执行一次。

one()方法的结构与bind()方法类似，使用方法也与bind()方法相同，其语法结构如下：one (type, [data], fn);

//使用one()方法为<button>元素绑定单击事件后，只在用户第1次单击按钮时，处理函数才执行，之后的单击就不会再起作用。
<script type="text/javascript">
        $(function () {
            $('#btn').one("click", function () {
                $('#test').append("<p>我的绑定函数1</p>");
            });
        })  
</script>    
<button id="btn">点击我</button>  
<div id="test"></div>