Wie kann ich Argumente an Ereignishandler in jQuery übergeben?

Mit jQuery-Code wie:

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

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

Wie übergebe ich Argumente myfunctionbei der Verwendung von jQuery?

Am einfachsten ist es, dies so zu tun (vorausgesetzt, Sie möchten nicht, dass die Ereignisinformationen an die Funktion übergeben werden) ...

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

jsFiddle .

Dadurch wird eine anonyme Funktion erstellt, die beim clickAuslösen des Ereignisses aufgerufen wird. Dies wird wiederum myfunction()mit den von Ihnen angegebenen Argumenten aufgerufen .

Wenn Sie ThisBindingden Wert beibehalten möchten (der Wert, zu thisdem die Funktion aufgerufen wird, setzen Sie ihn auf das Element, das das Ereignis ausgelöst hat), rufen Sie die Funktion mit auf call().

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

jsFiddle .

Sie können die Referenz nicht direkt so übergeben, wie es in Ihrem Beispiel angegeben ist, oder das einzige Argument ist das jQuery- eventObjekt .

Wenn Sie noch die Referenz zu übergeben möchten, müssen Sie jQuery nutzen proxy()Funktion (die eine Cross - Browser - Wrapper ist für Function.prototype.bind()). Auf diese Weise können Sie Argumente übergeben, die vor dem eventArgument gebunden sind .

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

jsFiddle .

In diesem Beispiel myfunction()würde mit seinem ausgeführt wird ThisBindingintakt ( nullkein Objekt ist , so dass der normale thisWert des Elements , das das Ereignis ausgelöst wird), zusammen mit den Argumenten (in dieser Reihenfolge) arg1, arg2und schließlich das jQuery - eventObjekt, das Sie ignorieren können wenn es nicht erforderlich ist (benennen Sie es nicht einmal in den Argumenten der Funktion).

Sie können auch die jQuery- eventObjekte verwenden data, um Daten zu übergeben. Dies würde jedoch eine Änderung erfordern, um myfunction()über event.data.arg1(die keine Funktionsargumente sind, wie in Ihren Fragen erwähnt) darauf zuzugreifen , oder zumindest eine manuelle Proxy-Funktion wie das vorherige Beispiel oder eine generierte mit dem letzteren Beispiel.

$("#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'
});

Außerdem können Sie bestimmte Ereignishandler mithilfe der Ein- und Ausschaltmethoden binden und die Bindung aufheben.

Beispiel:

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

Dies würde den myfunction handler von #myid lösen

Während Sie auf jeden Fall Alex 'Antwort verwenden sollten, wurde die "Bind" -Methode der Prototypbibliothek in Ecmascript 5 standardisiert und wird bald nativ in Browsern implementiert. Es funktioniert so:

jQuery("#myid").click(myfunction.bind(this, arg1, arg2));

Alter Thread, aber zu Suchzwecken; Versuchen:

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

... und überprüfen Sie den Parameter "data": http://api.jquery.com/on/

z.B:

function greet( event ) {
  alert( "Hello " + event.data.name );
}
$( "button" ).on( "click", {name: "Karl"}, greet );
$( "button" ).on( "click", {name: "Addy"}, greet );

Es gibt bereits gute Antworten, aber hier sind meine zwei Cent. Sie können auch verwenden:

$("#myid").click({arg1: "foo", arg2: "bar"}, myfunction)

Und der Hörer würde aussehen wie:

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

Einfach:

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

function myHandler(event){
   alert(event.data);     //passed in "event.data"
}