The unbind () method in jQuery is a reverse operation of the bind () method, which deletes the Bound event from each matching element.
Syntax structure:
[Javascript]
Unbind ([type] [, data]);
Unbind ([type] [, data]);
Type is the event type, and data is the event to be removed. The details are as follows:
1. If no parameter exists, all binding events are deleted;
2. If the event type is provided as the parameter, only binding events of this type will be deleted;
3. If the handler passed during binding is used as the 2nd parameter, only this specific event handler is deleted.
See the following example:
[Javascript]
<Script src = "http://www.gamejzy.com/js/jquery.js" type = "text/javascript"> </script>
<Style>
. Info {
Background: # ffff66;
}
</Style>
<Input type = "button" id = "btn" value = "Click me"/> <input type = "button" id = "delAll" value = "delete all binding functions" /> <input type = "button" id = "delFun2" value = "Delete the second binding function"/> <br/>
<Div class = "info"> </div>
<Script type = "text/javascript">
$ (Document). ready (function (){
// Add binding event for the button with id btn
$ ("# Btn"). bind ('click', fun1 = function (){
$ (". Info"). append ('<p> bind function 1 </p> ');
}). Bind ('click', fun2 = function (){
$ (". Info"). append ('<p> bind function 2 </p> ');
}). Bind ('click', fun3 = function (){
$ (". Info"). append ('<p> bind function 3 </p> ');
})
$ ("# DelAll"). bind ('click', function (){
$ ("# Btn"). unbind (); // delete all binding events
})
$ ("# DelFun2"). bind ('click', function (){
$ ("# Btn"). unbind ('click', fun2); // Delete the second binding function
})
})
</Script>
<Script src = "http://www.gamejzy.com/js/jquery.js" type = "text/javascript"> </script>
<Style>
. Info {
Background: # ffff66;
}
</Style>
<Input type = "button" id = "btn" value = "Click me"/> <input type = "button" id = "delAll" value = "delete all binding functions" /> <input type = "button" id = "delFun2" value = "Delete the second binding function"/> <br/>
<Div class = "info"> </div>
<Script type = "text/javascript">
$ (Document). ready (function (){
// Add binding event for the button with id btn
$ ("# Btn"). bind ('click', fun1 = function (){
$ (". Info"). append ('<p> bind function 1 </p> ');
}). Bind ('click', fun2 = function (){
$ (". Info"). append ('<p> bind function 2 </p> ');
}). Bind ('click', fun3 = function (){
$ (". Info"). append ('<p> bind function 3 </p> ');
})
$ ("# DelAll"). bind ('click', function (){
$ ("# Btn"). unbind (); // delete all binding events
})
$ ("# DelFun2"). bind ('click', function (){
$ ("# Btn"). unbind ('click', fun2); // Delete the second binding function
})
})
</Script>
Effect diagram:
Author: liruxing1715