javascript 将数据传递给 jQuery 事件处理程序
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12527198/
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
Passing data to a jQuery event handler
提问by Alberto De Caro
Scenario
设想
In a GUI, a user inserts some text in a text input and then clicks a button: inserted text will be displayed in a div.
在 GUI 中，用户在文本输入中插入一些文本，然后单击按钮：插入的文本将显示在 div 中。
I have found a trivial solution (demo here), that is setting the output text inside the handler accessing the input element object. It sucks. Rather, I would pass the input text (not the element) to the handler.
我找到了一个简单的解决方案（此处为演示），即在访问输入元素对象的处理程序中设置输出文本。糟透了。相反，我会将输入文本（而不是元素）传递给处理程序。
Question
问题
How can I pass parameters (the input message text in this case) to the handler function?
如何将参数（在本例中为输入消息文本）传递给处理函数？
采纳答案by Anoop
I modified the code in your jsFiddle. In jQuery, you can pass data as an argument and access it using event.datajQuery reference.
我修改了你的 jsFiddle 中的代码。在 jQuery 中，您可以将数据作为参数传递并使用event.datajQuery 引用访问它。
回答by Alnitak
/*
* I would not to referer UI elements here
* Rather I would pass the $('#txtMessage').val() to the handler
*/
That is impossible.
那是不可能的。
If you want to use the current value of that input element then you have to access the UI element itself.
如果要使用该输入元素的当前值，则必须访问 UI 元素本身。
If your intent is to decouple the event handler from knowing which specificelement is to be accessed, that's easily done by using event data to pass it to the handler, e.g.:
如果您的意图是将事件处理程序与了解要访问的特定元素分离，则可以通过使用事件数据将其传递给处理程序来轻松完成，例如：
$(sel).on('click', {
source: document.getElementById('txtMessage')
}, handler);
and the in the callback:
和回调中的：
function handler(event) {
var txt = event.data.source.value;
...
}
Note that the jQuery event data is supposed to be a map of key: valuepairs as shown above. Passing in a jQuery object directly as shown in the accepted answer could easily break.
请注意，jQuery 事件数据应该是key: value如上所示的成对映射。如已接受的答案所示，直接传入 jQuery 对象很容易中断。
回答by bhb
Check this - http://api.jquery.com/event.data/
检查这个 - http://api.jquery.com/event.data/
Your JS would be something like this (untested):
你的 JS 应该是这样的（未经测试）：
$('#myButton').on("click", {val: $('#txtMessage').val()}, function(event){
$('#divOutput').html(event.data.val);
});?
回答by Rune FS
This will give you the current value of the input element. It basically still accesses the input element but there's no way to avoid that if you wish to acquire the current value
这将为您提供输入元素的当前值。它基本上仍然访问输入元素，但如果您希望获取当前值，则无法避免这种情况
$('#myButton').on("click", {val: function (){ return $('#txtMessage').val()}}, function(event){
$('#divOutput').html(event.data.val());
});?
