jQuery .on() 方法 - 将参数传递给事件处理函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15904243/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery .on() method - passing argument to event handler function
提问by Paramore
I have the following script which does not work
我有以下脚本不起作用
<script type="text/javascript" >
function ADS(e){ alert(e); }
$(document).ready(function(){
$(document).on("dblclick","#an_tnam tr", ADS('hello'));
$(document).on("dblclick","#kv_tnam tr", ADS('world'));
// ....
});
</script>
how can I pass argument to event handler function ADS ?
如何将参数传递给事件处理函数 ADS？
回答by David Barker
You can pass extra data to an event handling function and can be accessed using event.datawithin the handler.
您可以将额外的数据传递给事件处理函数，并且可以event.data在处理程序中使用它进行访问。
$(document).on('dblclick', '#an_tnam tr', { extra : 'random string' }, function(event)
{
var data = event.data;
// Prints 'random string' to the console
console.log(data.extra);
}
You can also send extra data to any event you like when triggering the event from an external source using the .trigger()method
当使用该.trigger()方法从外部源触发事件时，您还可以将额外数据发送到您喜欢的任何事件
$('#an_tnam tr').trigger('click', [{ extra : 'random string' }]);
The difference with passing data to the trigger method is that it expects the handler to take extra arguments of the length of the array passed in. The above would expect the handler to have one extra argument to contain the object passed in.
与将数据传递给 trigger 方法的区别在于，它期望处理程序采用传入数组长度的额外参数。 上面期望处理程序有一个额外的参数来包含传入的对象。
$('#an_tnam tr').on('click', function(event, obj)
{
// Prints 'random string' to the console
console.log(obj.extra);
}
回答by Anthony Grist
The .on()function expects a function referenceto be passed; what you're doing is calling the function and passing its return value. If you need to pass a parameter you'll need to wrap the call in an anonymous function.
该.on()函数需要传递一个函数引用；您正在做的是调用该函数并传递其返回值。如果需要传递参数，则需要将调用包装在匿名函数中。
$(document).on('dblclick', '#an_tnam tr', function(event) {
ADS('hello');
});
jQuery always passes its normalized event object as the first argument to the function to be executed.
jQuery 总是将其规范化的事件对象作为第一个参数传递给要执行的函数。
回答by Ignacio Segura
Actually, there is a very neat simple way to achieve this, with no extra clutter and no anonymous functions, using JS bind():
实际上，使用 JS bind() 有一个非常简洁的方法来实现这一点，没有额外的混乱和匿名函数：
$(document).on('dblclick', ADS.bind(null, 'hello'));
First parameter is the value you want "this" to have inside callback function.
第一个参数是您希望“ this”在回调函数中具有的值。
MOre info in Mozilla Developer Network: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Function/bind
Mozilla 开发者网络中的更多信息：https: //developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Function/bind
回答by Blazemonger
As Anthony Gristpointed out, the .on()method is expecting a function reference at that part; you're evaluating a function which returns nothing (null).
正如Anthony Grist指出的那样，该.on()方法期望在该部分有一个函数引用；您正在评估一个不返回任何内容的函数 ( null)。
However, one fun feature of JavaScript is that everything is an object, including functions. With a small modification, you can change ADS()to return an anonymous function object instead:
然而，JavaScript 的一个有趣特性是一切都是对象，包括函数。通过一个小的修改，你可以ADS()改为返回一个匿名函数对象：
function ADS(e){
return function(){ alert(e); };
}
回答by alexclooze
function ADS(e){ alert(e); }
$(document).ready(function(){
$(document).on("dblclick","#an_tnam tr", function (e) { ADS('hello') });
});
will do the trick.
会做的伎俩。
回答by alexclooze
function ADS(e) {
return function() {
alert(e);
};
}
Like that when you're doing
就像你做的那样
$(document).on("dblclick","#an_tnam tr", ADS('hello'));
, it is the returned function that is assigned as event handler (and your string argument is passed when you're assigning the handler, not when it's called).
，它是分配为事件处理程序的返回函数（并且您的字符串参数在您分配处理程序时传递，而不是在调用时传递）。
