Question

几个星期前，我很痛苦地能够动态地将按钮添加到具有自己的.on（'click'..处理程序的HTML DOM对象中，并使用e.stopPropgation来阻止这些新的子元素触发事件。

我做的奇怪的事情是调用一个没有任何括号的函数。我不知道为什么我这样做或为什么它工作，或者为什么当我做附加括号时它不起作用。我想知道我是否通过侥幸而不是设计做某事（现在我将添加评论）。

就是这样：

//Container is the parent element
// var buttons stores the buttons with class 'buttons'
$('.container').on('click', function(){
    $(buttons).appendTo($(this)).fadeIn(500).find('.buttons').click(tableButton);
});

function tableButton(e){
    e.stopPropagation();
    //do stuff

}

我无法弄清楚为什么我写了一个没有争论的tableButton调用或为什么它完美地工作。我试图将语法更改为

.find('.buttons').on('click', function(e){
  tableButton(e);
});

然后它不再有效。

任何帮助表示赞赏！

Answer 1

它的工作原理是因为你将一个函数传递给click处理程序而不是自己调用函数（（））一个例子：

var testFunction = function(msg) {
    alert(msg);
}

var functionCaller = function(functionToCall) {
    functionToCall('hello!');
}

functionCaller(testFunction);

functionCaller将message参数传递给testFunction（），但我们只将testFunction传递给functionCaller（不带参数）

对于不起作用的部分，不是函数名tableButton（）而不是tableButtons（）吗？

请参阅http://jsfiddle.net/g2PAn/

Answer 2

你实际上并没有调用它，你只是声明它和它接受的参数。确实使用参数调用了单击回调，但不是由你调用。

问题可能来自于jQuery使用点击绑定为this的元素调用您的函数，您可以像这样调用表按钮：

.find('.buttons').on('click', function(e){
     tableButton.call(this, e);
});

JavaScript调用没有括号的函数

2 个答案: