Jquery's unbind () function details

Turn: http://www.popo4j.com/article/jQuery-unbind.html

Jquery's binding events are very convenient, including BIND, unbind, live, And one. It also helps you separate some common events, such as the onclick event of the control, when binding an onclick event, you only need

 
$ ("# Testbutton"). Click (Function(){
Alert ("I'm test button");
});
 

What if we want to cancel the binding event?
Jquery has the unbind method, which is used to cancel binding events.

$ ("# Testbutton"). Unbind ("Click");
 

Is it easy? If you have two click events, you can also use unbind ("click", fnname) to delete the binding of a specific function.

Why is there a way to cancel a specific function? Let's look at the example below and we will find that,JavascriptSame as C # events, event binding is superimposed (+ =) rather than overwriting.

 VaR  Eat  =     Function  (){
Alert (  " I want to eat  "  );
}
  VaR  Paymoney  =     Function  (){
Alert (  "  Pay first  "  );
}
Jquery (document). Ready (  Function  (){
$ (  "  # Testbutton "  ). Click (EAT );
$ (  "  # Testbutton  "  ). BIND (  "  Click  "  , Paymoney );
}); 

We found that "I want to eat" will pop up first, and then "pay first" will pop up"

To unbind a specific function:

$ ("# Testbutton"). Unbind ("Click", Paymoney );
 

Note: The jquery unbind method can only cancel events bound to the jquery BIND () method,

In the jquery source code, we can see $ (). click to call $ (). BIND ("click") event, so as long as it is an event added by jquery, unbind can unbind the event. unbind is powerless for such events added by native JS or events added by other JS frameworks.

 <  Input ID  =  "  Testbutton  "  Type =  "  Button  "  Value  =  "  Test button  "  Onclick  =  "  Eat ();  "     /  >  
 <  Script Type  =  "  Text/JavaScript  "  >  
Jquery (document). Ready (  Function  (){
$ (  "  # Testbutton  "  ). Unbind (  "  Click  " , Eat );
$ (  "  # Testbutton  "  ). Unbind ();
$ (  "  # Testbutton  "  ). BIND (  "  Click  "  , Paymoney );
});
  <  /  SCRIPT> 

Let's guess what it will show? Dinner? Pay? The answer is eat-> paymoney, ah !!! I canceled the binding and deleted the specific binding. Why is the Eat still executed?

Take a closer look.

 
Onclick="Eat ();"
 

How does the unbind function solve this problem? Let's take a look at this article.ArticleJquery replaces the events bound to the element.