click事件的事件处理程序自动触发 – jQuery

可能重复：
为什么在页面加载时会立即触发click事件处理程序？

我对Javascript函数的理解存在差距所以我很难理解为什么我的事件处理程序在没有匿名包装器的情况下定义时会自动触发。

HTML

Change HTML 

Javascript＃1

 var btn = $('#change-html'); btn.click(bindClick(btn)); // bindClick gets executed right away and only once function bindClick(source){ console.log('get here'); } 

Javascript＃2

 var btn = $('#change-html'); btn.click(function(){ bindClick(btn); // bindClick is only executed on the anchor's click event }); function bindClick(source){ console.log('get here'); } 

Answer 1

其实这里

 btn.click(bindClick(btn)); 

您只是将函数的返回值绑定到click事件，而不是函数本身。
因为在javascript中你可以返回一个函数，这将起作用

 var btn = $('#change-html'); btn.click(bindClick(btn)); function bindClick(source){ return function() { console.log('get here'); } } 

http://jsfiddle.net/VZ4Gq/

EDIT – 第二个函数是一个闭包吗？是的，它可能是。在这个例子中让我们开心

 var btn = $('#change-html'); btn.click(bindClick(btn)); // global scope var inside = "i'm outside a closure"; console.log(inside); function bindClick(source){ // local scope var inside = "i'm inside a closure"; return function() { console.log(inside); } } 

http://jsfiddle.net/VZ4Gq/1/

当你尝试这个时，你首先记录“我在一个关闭之外”，然后当你点击按钮时，你会得到“我在一个关闭之内”。 这是因为你实际创建了一个闭包和函数，当它执行时，它在它的原始作用域中执行，这是在bindClick（）中

Answer 2

问题是 ：

 btn.click(bindClick(btn)); 

它将调用bindClick方法。 尝试使用此更改该行，并查看与JavaScript＃2相同的行为：

 btn.click({param1: btn }, bindClick); 

或者更简单：

 btn.click({param1: btn }, $(this));