Wie erstelle ich ein benutzerdefiniertes onEnter-Ereignis in jQuery?

Question

Ich möchte ein benutzerdefiniertes Ereignis in jQuery erstellen, die onkeypress Ereignisse erfasst ENTER, so dass ich nicht jedes Mal auf diese Weise zu codieren haben:

if(e.keyCode == 13) { 
    // event code here 
} 

Mit anderen Worten, ich möchte Code in der Lage sein möchten wie folgt aus:

$("selector").bind("enter", function(){ 
    // event code here 
}); 

Answer 1

Moderne jQuery (1.7 und höher) verwendet .on() Event-Handler zu binden:

// delegate binding - replaces .live() and .delegate() 
$(document.body).on("keyup", ":input", function(e) { 
    if(e.which == 13) 
    $(this).trigger("enter"); 
}); 

// direct binding - analogous to .keyup() 
$(":input").on("keyup", function(e) { 
    if(e.which == 13) 
    $(this).trigger("enter"); 
}); 

Ältere Versionen von jQuery verwenden Sie eine der folgenden Methoden. Sie könnten einen einzigen .live() oder .delegate() Event-Handler für alle Elemente haben. Dann verwenden, das benutzerdefinierte Ereignis auszulösen, wie folgt aus:

$(document.body).delegate(":input", "keyup", function(e) { 
    if(e.which == 13) 
    $(this).trigger("enter"); 
}); 

Nicht für jedes Element :input Sie genau das tun konnte, was Sie haben:

$("selector").bind("enter", function(){ 
    //enter was pressed! 
}); 

You can test it out here.

Answer 2

$("selector").keyup(function (e) { 
    if (e.keyCode == 13) { 
    $(this).trigger("enter"); 
    } 
}).bind("enter", function() { 
    // event code here 
}); 

Es ist eine gute Idee Namespaced Ereignisnamen zu verwenden, die Möglichkeit, versehentlich clashing mit anderem jQuery-Code zu reduzieren, die benutzerdefinierten Ereignisse verwendet. Also statt "enter" könnte man "enter.mywebapp" oder etwas ähnliches verwenden. Je mehr benutzerdefinierte Ereignisse Sie verwenden, desto sinnvoller.