jQuery 的 .click - 将参数传递给用户函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3273350/
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's .click - pass parameters to user function
提问by Paul Hoffer
I am trying to call a function with parameters using jQuery's .click, but I can't get it to work.
我正在尝试使用 jQuery 的 .click 调用带有参数的函数,但我无法让它工作。
This is how I want it to work:
这就是我希望它工作的方式:
$('.leadtoscore').click(add_event('shot'));
$('.leadtoscore').click(add_event('shot'));
which calls
其中调用
function add_event(event) {
blah blah blah }
It works if I don't use parameters, like this:
如果我不使用参数,它会起作用,如下所示:
$('.leadtoscore').click(add_event);
function add_event() {
blah blah blah }
But I need to be able to pass a parameter through to my add_event
function.
但是我需要能够将参数传递给我的add_event
函数。
How can I do this specific thing?
我该如何做这件事?
I know I can use .click(function() { blah }
, but I call the add_event
function from multiple places and want to do it this way.
我知道我可以使用.click(function() { blah }
,但我add_event
从多个地方调用该函数并希望这样做。
回答by Chris Kempen
For thoroughness, I came across another solution which was part of the functionality introduced in version 1.4.3 of the jQuery click event handler.
为彻底起见,我遇到了另一个解决方案,它是 jQuery单击事件处理程序1.4.3 版中引入的功能的一部分。
It allows you to pass a data map to the event object that automatically gets fed back to the event handler function by jQuery as the first parameter. The data map would be handed to the .click()
function as the first parameter, followed by the event handler function.
它允许您将数据映射传递给事件对象,该对象自动通过 jQuery 作为第一个参数反馈给事件处理函数。数据映射将.click()
作为第一个参数传递给函数,然后是事件处理函数。
Here's some code to illustrate what I mean:
下面是一些代码来说明我的意思:
// say your selector and click handler looks something like this...
$("some selector").click({param1: "Hello", param2: "World"}, cool_function);
// in your function, just grab the event object and go crazy...
function cool_function(event){
alert(event.data.param1);
alert(event.data.param2);
}
I know it's late in the game for this question, but the previous answers led me to this solution, so I hope it helps someone sometime!
我知道这个问题已经迟到了,但是之前的答案让我找到了这个解决方案,所以我希望它在某个时候对某人有所帮助!
回答by Nick Craver
You need to use an anonymous function like this:
您需要使用这样的匿名函数:
$('.leadtoscore').click(function() {
add_event('shot')
});
You can call it like you have in the example, just a function name withoutparameters, like this:
您可以像示例中那样调用它,只是一个没有参数的函数名,如下所示:
$('.leadtoscore').click(add_event);
But the add_event
method won't get 'shot'
as it's parameter, but rather whatever click
passes to it's callback, which is the event
object itself...so it's not applicable in this case, but works for many others. If you need to pass parameters, use an anonymous function...or, there's one otheroption, use .bind()
and pass data, like this:
但是该add_event
方法不会得到'shot'
它的参数,而是click
传递给它的回调的任何东西,它是event
对象本身......所以它在这种情况下不适用,但适用于许多其他情况。如果您需要传递参数,请使用匿名函数……或者,还有另一种选择,使用.bind()
并传递数据,如下所示:
$('.leadtoscore').bind('click', { param: 'shot' }, add_event);
And access it in add_event
, like this:
并在 中访问它add_event
,如下所示:
function add_event(event) {
//event.data.param == "shot", use as needed
}
回答by user113716
If you call it the way you had it...
如果你按照你的方式称呼它......
$('.leadtoscore').click(add_event('shot'));
...you would need to have add_event()
return a function, like...
...您需要add_event()
返回一个函数,例如...
function add_event(param) {
return function() {
// your code that does something with param
alert( param );
};
}
The function is returned and used as the argument for .click()
.
该函数被返回并用作 的参数.click()
。
回答by Gravity Grave
I had success using .on() like so:
我像这样使用 .on() 取得了成功:
$('.leadtoscore').on('click', {event_type: 'shot'}, add_event);
Then inside the add_event
function you get access to 'shot' like this:
然后在add_event
函数内部,您可以像这样访问“镜头”:
event.data.event_type
See the .on() documentationfor more info, where they provide the following example:
有关更多信息,请参阅.on() 文档,其中提供了以下示例:
function myHandler( event ) {
alert( event.data.foo );
}
$( "p" ).on( "click", { foo: "bar" }, myHandler );
回答by Kevin
Yes, this is an old post. Regardless, someone may find it useful. Here is another way to send parameters to event handlers.
是的,这是一个旧帖子。无论如何,有人可能会发现它很有用。这是将参数发送到事件处理程序的另一种方法。
//click handler
function add_event(event, paramA, paramB)
{
//do something with your parameters
alert(paramA ? 'paramA:' + paramA : '' + paramB ? ' paramB:' + paramB : '');
}
//bind handler to click event
$('.leadtoscore').click(add_event);
...
//once you've processed some data and know your parameters, trigger a click event.
//In this case, we will send 'myfirst' and 'mysecond' as parameters
$('.leadtoscore').trigger('click', {'myfirst', 'mysecond'});
//or use variables
var a = 'first',
b = 'second';
$('.leadtoscore').trigger('click', {a, b});
$('.leadtoscore').trigger('click', {a});
回答by Vladimir Novick
$imgReload.data('self', $self);
$imgReload.click(function (e) {
var $p = $(this).data('self');
$p._reloadTable();
});
Set javaScript object to onclick element:
将 javaScript 对象设置为 onclick 元素:
$imgReload.data('self', $self);
get Object from "this" element:
从“this”元素获取对象:
var $p = $(this).data('self');
回答by susan097
I get the simple solution:
我得到了简单的解决方案:
<button id="btn1" onclick="sendData(20)">ClickMe</button>
<script>
var id; // global variable
function sendData(valueId){
id = valueId;
}
$("#btn1").click(function(){
alert(id);
});
</script>
My mean is that pass the value onclick
event to the javascript function sendData()
, initialize to the variable and take it by the jquery event handler method.
我的意思是将 valueonclick
事件传递给javascript function sendData()
,初始化为变量并通过 jquery 事件处理程序方法获取它。
This is possible since at first sendData(valueid)
gets called and initialize the value. Then after jquery event get's executed and use that value.
这是可能的,因为首先sendData(valueid)
被调用并初始化值。然后在执行 jquery 事件之后并使用该值。
This is the straight forward solution and For Detail solution go Here.
这是直接的解决方案,有关详细信息的解决方案,请转到此处。