使用jQuery data（）方法存储函数

The jQuery .data() documentation says the following:

jQuery .data（）文档说明如下：

The .data() method allows us to attach data of any type to DOM element

I assume "any type" refers to functions as well. Say I have a div with the id foo as such:

我假设“任何类型”也指功能。假设我有一个id为foo的div：

<div id="foo">Foo!</div>

And I'd like to store a function in it called say that takes a parameter. According to the documentation I'd store the function this way:

我想在其中存储一个名为say的函数。根据文档，我将以这种方式存储函数：

$("#foo").data("say", function(message){
   alert("Foo says "+message);
});

My question is, how do I invoke the function with a parameter when I wish to do so.

我的问题是，当我希望这样做时，如何使用参数调用该函数。

$("#foo").data("say"); should return the function, but how would I pass a parameter to it?

$（ “＃富”）的数据（ “说”）;应该返回函数，但是如何将参数传递给它？

Thanks!

谢谢！

3 个解决方案

#1

var myFunction = $("#foo").data("say");
myFunction(someParameter);

#2

A better alternative to storing functions in data is using custom events. This can be done easily with on and trigger:

在数据中存储函数的更好的替代方法是使用自定义事件。这可以通过on和trigger轻松完成：

$('#foo').on('say', function(e, arg){
    alert('Foo says ' + arg);
});

$('#foo').trigger('say', 'hello');

Example: http://jsfiddle.net/tW66j/

示例：http：//jsfiddle.net/tW66j/

Note: on earlier versions of jQuery (until 1.7), .bind was used instead of .on.

注意：在早期版本的jQuery（直到1.7）中，使用.bind而不是.on。

#3

Here's a more elegant way to call the method.

这是一种更优雅的方法来调用该方法。

// store the method with data
$('#foo').data('bar',function(){console.log("Givin it the business!")});

// Simple execution (this will not keep the method in scope)
$('#foo').data('bar')();

// scoped method execution with call([scope,arguments[]]), takes arguments with comma separation
$('#foo').data('bar').call($('#foo').first()[0],'arguemnts','for','method');

// scoped method execution with apply(scope[,argument[]]), takes an array of arguments
$('#foo').data('bar').apply($('#foo').first()[0],['arguemnts','for','method']);

Apply Method: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/apply

申请方法：https：//developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/apply

Call Method: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/call

调用方法：https：//developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/call

#1

var myFunction = $("#foo").data("say");
myFunction(someParameter);

#2