Question

我正在尝试在点击DOM元素时执行外部函数，而不将其包装在另一个函数中。

假设我有一个名为sayHello()的函数，如下所示：

function sayHello(){
  alert("hello");
};

要点击执行，我目前必须这样做：

$("#myelement").click(function(){
  sayHello();
});

注意我被迫在另一个函数中包装单个函数调用。我想做的就是这样的事情

$("#myelement").click(sayHello());

除了根本不起作用。我可以避免以任何方式将单个函数调用包装在另一个函数中吗？谢谢！

其他信息：当我需要将参数传递给函数时，我将如何实现相同的目标？

...

其他信息：就像Chris Brandsma和Jani Hartikainen指出的那样，应该能够使用bind函数将参数传递给函数，而不必将其包装在另一个匿名函数中：

$("#myelement").bind("click", "john", sayHello);

sayHello()现在接受一个新参数，如下：

function sayHello(name){
  alert("Hello, "+name);
}

不幸的是，这似乎不起作用......有什么想法吗？事件/绑定文档位于here 谢谢！

Answer 1

从你在那里的问题中接受。

显然，你需要以这种方式调用它：

$("#myelement").click(sayHello);

以实际方式调用它实际执行方法，而不是将方法发送到点击处理程序。

如果您需要传递数据，您也可以这样调用方法：

$("#myelement").click(function(){ sayHello("tom");});

或者您可以通过bind()函数

传递数据

function sayHello(event){ alert("Hello, "+event.data); }

$("#myelement").bind("click", "tom", sayHello);

或者您可以从点击的元素中检索数据

$("#myelement").click(function(){sayHello($(this).attr("hasData");});.

希望有所帮助。

Answer 2

您正在调用sayHello函数，您可以通过删除括号来引用它：

$("#myelement").click(sayHello);

编辑：如果需要将参数传递给sayHello函数，则需要将其包装在另一个函数中。这定义了一个无参数的新函数，它使用创建时提供的参数调用函数：

$("#myelement").click(function () {
   sayHello('name');
   // Creates an anonymous function that is called when #myelement is clicked.
   // The anonymous function invokes the sayHello-function
});

Answer 3

。
$（ “＃myelement”）点击（sayHello的（））;

这实际上是在设置sayHello()处理程序之前调用click。它试图将sayHello()的返回值设置为回调函数！

相反，请尝试：

$("#myelement").click(sayHello);

关于你的编辑，如果你需要传递参数，你可以使用你已经使用的闭包技术，但如果你正在寻找更清洁的东西，那么看看How can I pass a reference to a function, with parameters?

Answer 4

点击时你会传递什么参数？如果你事先知道它们是什么，你可以在用户点击之前设置它们。

你不能传递参数，但你可以通过简单地将成员添加到触发事件的对象来伪造参数，所以..

myObject.onClick = sayHello;
myObject.param1 = "foo";

然后，当你打电话给这个

function sayHello(){
  alert(this.param1);
}

Answer 5

bind()方法现已被弃用。

自jQuery 3.0起，.bind()已被弃用。自jQuery 1.7起，它已被.on()方法所取代，该方法用于将事件处理程序附加到文档，因此已经不鼓励使用它。

为了保持一致性，最好使用on()方法进行所有事件绑定。您可以将参数作为事件名称之后的第二个参数传递给处理程序。

function sayHello(name){
    console.log('Hello ' + name);
};

$('#myelement').on('click', 'John', sayHello);

Answer 6

是的，不要传递sayHello（），只需传递函数名称即可。

$("#myelement").click(sayHello);

单击元素时如何执行外部函数？

6 个答案: