How to unbind a specific event handler

Question

Code:

$('#Inputfield').keyup(function(e)         {             if(e.which == 13)             {                 functionXyz();             }             else             {                 functionZyx();             }     });     $(document).keyup(function(exit) {               if (exit.keyCode == 27) { functionZzy(); } }); 

Question: How to remove the keyup event handler of keyCode == 27 and keep the other $(document).keyup event handlers intact?

Answer 1

You have to use a named function so you can reference that specific handler when calling .unbind(), like this:

function keyUpFunc(e) {   if (e.keyCode == 27) { functionZzy(); } } $(document).keyup(keyUpFunc); 

Then later when unbinding:

$(document).unbind("keyup", keyUpFunc); 

Answer 2

Your are attaching the event handlers to different elements, so you can safely remove the handler from the specific object (already mentioned I know).

For the sake of completeness, if you want to attach multiple handlers for the same event to the same object, you can use namespaced events:

$('#Inputfield').bind('keyup.keep', function(e){/*...*/}); $('#Inputfield').bind('keyup.notkeep', function(e){/*...*/});  $('#Inputfield').unbind('keyup.notkeep'); // or event  $('#Inputfield').unbind('.notkeep'); 

---

Since jQuery 1.7, the methods .on and .off are the preferred way to add and remove event handlers. For this purpose they behave exactly like .bind and .unbind and also work with namespaced events.