Event handling jQuery unclick() and unbind() events?
-
02-07-2019 - |
Question
I want to attach a click event to a button element and then later remove it, but I can't get unclick() or unbind() event(s) to work as expected. In the code below, the button is 'tan' colour and the click event works.
window.onload = init;
function init() {
$("#startButton").css('background-color', 'beige').click(process_click);
$("#startButton").css('background-color', 'tan').unclick();
}
How can I remove events from my elements?
Solution
There's no such thing as unclick()
. Where did you get that from?
You can remove individual event handlers from an element by calling unbind:
$("#startButton").unbind("click", process_click);
If you want to remove all handlers, or you used an anonymous function as a handler, you can omit the second argument to unbind()
:
$("#startButton").unbind("click");
OTHER TIPS
Or you could have a situation where you want to unbind the click function just after you use it, like I had to:
$('#selector').click(function(event){
alert(1);
$(this).unbind(event);
});
unbind is your friend.
$("#startButton").unbind('click')
Are you sure you want to unbind it? What if later on you want to bind it again, and again, and again? I don't like dynamic event-handling bind/unbind, since they tend to get out of hand, when called from different points of your code.
You may want to consider alternate options:
- change the button "disabled" property
- implement your logic inside "process_click" function
Just my 2 cents, not an universal solution.