javascript - 如何在jQuery中将参数传递给事件处理程序?

使用jQuery代码:

$("#myid").click(myfunction);

function myfunction(arg1, arg2) {/* something */}

在使用jQuery时如何将参数传递给myfunction

6个解决方案
105 votes

最简单的方法就是这样做(假设您不希望任何事件信息传递给函数)......

$("#myid").click(function() {
    myfunction(arg1, arg2);
});

的jsfiddle。

这将创建一个匿名函数,该函数在触发data事件时调用。 这将依次使用您提供的参数调用myfunction()

如果要保留data(调用函数时值data,设置为触发事件的元素),则使用data调用该函数。

$("#myid").click(function() {
    myfunction.call(this, arg1, arg2);
});

的jsfiddle。

您不能以您的示例所声明的方式直接传递引用,或者它的单个参数将是jQuery data对象。

如果您确实想要传递引用,则必须利用jQuery的data函数(这是data的跨浏览器包装器)。 这允许您传递在data参数之前绑定的参数。

$("#myid").click($.proxy(myfunction, null, arg1, arg2));   

的jsfiddle。

在此示例中,data将执行,其myfunction()完好无损(event.data.arg1不是对象,因此使用触发事件的元素的正常值为this),以及参数(按顺序)arg1arg2,最后是jQuery event对象,如果不需要,可以忽略它(甚至不在函数的参数中命名)。

您也可以使用jQuery data对象的data来传递数据,但是这需要修改myfunction()以通过event.data.arg1访问它(这不是像您的问题提到的函数参数),或者至少引入手动代理函数,如前一个示例 或者使用后一个例子生成的。

alex answered 2019-09-11T00:51:07Z
66 votes
$("#myid").on('click', {arg1: 'hello', arg2: 'bye'}, myfunction);

function myfunction(e) {

    var arg1 = e.data.arg1;
    var arg2 = e.data.arg2;

    alert(arg1);
    alert(arg2);

}

//call method directly:
myfunction({
    arg1: 'hello agian', 
    arg2: 'bye again'
});

还允许您使用on和off方法绑定和取消绑定特定事件处理程序。

例:

$("#myid").off('click', myfunction);

这将取消绑定#myid的myfunction处理程序

George Filippakos answered 2019-09-11T00:51:41Z
11 votes

虽然你当然应该使用Alex的答案,但原型库的“绑定”方法已在Ecmascript 5中标准化,并且很快将在本机浏览器中实现。 它的工作原理如下:

jQuery("#myid").click(myfunction.bind(this, arg1, arg2));
Breton answered 2019-09-11T00:52:06Z
5 votes

旧线程,但用于搜索目的; 尝试:

$(selector).on('mouseover',...);

...并查看“data”参数:[http://api.jquery.com/on/]

例如。:

function greet( event ) {
  alert( "Hello " + event.data.name );
}
$( "button" ).on( "click", {name: "Karl"}, greet );
$( "button" ).on( "click", {name: "Addy"}, greet );
dhc answered 2019-09-11T00:52:44Z
1 votes

简单:

$(element).on("click", ["Jesikka"],  myHandler);

function myHandler(event){
   alert(event.data);     //passed in "event.data"
}
T.Todua answered 2019-09-11T00:53:09Z
1 votes

已经有很好的答案,但无论如何,这是我的两分钱。 您还可以使用:

function myfunction(event){ alert(event.data.arg1); alert(event.data.arg2); }

听众看起来像:

function myfunction(event){ alert(event.data.arg1); alert(event.data.arg2); }

Leo answered 2019-09-11T00:53:53Z
translate from https://stackoverflow.com:/questions/979337/how-can-i-pass-arguments-to-event-handlers-in-jquery