为什么这些 Javascript 不一样？ [复制]答案

【问题标题】：Why aren't these Javascripts the same? [duplicate]为什么这些 Javascript 不一样？ [复制]
【发布时间】：2017-05-10 04:13:28
【问题描述】：

$(document).ready(function() {
    $("button").on("click", TestFunction());
});

function TestFunction() {
    console.log("Function called");
    $b = $("#test");
    $b.remove();
}

对

$(document).ready(function() {
    $("button").on("click", function() {
        $b = $("#test");
        $b.remove();          
    });
  });

页面加载后，第一个删除按钮#test。无需单击按钮，它只是将其删除。第二个按预期工作。该按钮会显示出来，并且在被调用之前不会被移除。

我不了解 Javascript 语法/jQuery API 的哪一部分？我认为传递给 .on() 的处理程序参数是一个函数。我在第一个示例中传递了一个函数，它似乎调用了它，但它忽略了“点击”。

在调用函数之前不应该忽略函数内部的任何内容吗？

【问题讨论】：

因为一个传递函数，另一个调用函数。
“在调用函数之前，不应该忽略函数内部的任何内容吗？” 这正是您对 TestFunction() 所做的事情。 () 在函数引用之后总是调用该函数。 foo(bar()) 首先调用bar 并将其返回值传递给foo。 foo(bar) 将bar 的值（即函数对象本身）传递给foo。
除了链接的副本，请参阅this question（和其他）。

标签： javascript jquery

【解决方案1】：

$("button").on的第二个参数接受一个函数和NOT一个函数的返回值（除非返回值是键入function)。您对第二个版本做对了，但对第一个版本不正确。因此，要在第一个版本中解决您的问题，您必须像这样传递一个函数：

$(document).ready(function() {
    $("button").on("click", TestFunction);
});

【讨论】：

啊，我没看懂。传递 with () 调用函数并返回一个值。没有 () 它只是引用函数，对吗？
"$("button").on 的第二个参数接受一个函数，而不是函数的返回值。" - 注意函数的返回值可能是对另一个函数的引用。（它不在 OP 的代码中，但它可能在其他代码中。）
@nnnnnn 不错！我已经编辑了我的答案

【解决方案2】：

$ ( document ). ready ( function () { 
$ ( "button" ). on ( "click" , TestFunction); });

现在应该可以了， () 立即调用函数，而没有它们，您将传递函数值

【讨论】：

【解决方案3】：

在绑定事件的第一种方式中，您实际上是在调用一个函数，并且该函数返回的任何内容都将与按钮的单击事件绑定。

因此，您应该只传递应该与元素绑定的函数名称，而不是调用函数。

$(document).ready(function() {
    $("button").on("click", TestFunction);
});

【讨论】：