Home > Article > Web Front-end > How to cancel the event bound by on() in jquery
Cancellation method: 1. Use the off() function, which can remove the event handler added through on(). The syntax is "event-bound element.off()"; 2. Use unbind () function, this function can delete the event handler added by any jq method, the syntax is "event-bound element.unbind();".
The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.
jquery cancels on() bound events
Method 1: Use off() function
The off() function is usually used to remove event handlers added through the on() method.
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script src="js/jquery-1.10.2.min.js"></script> <script> $(document).ready(function() { $("p").on("click", function() { $(this).slideToggle(); }); $("button").click(function() { $("p").off(); }); }); </script> </head> <body> <p>这是一个段落。</p> <p>这是另一个段落。</p> <p>点击任何段落可以令其消失。包括本段落。</p> <button>移除on()添加的事件</button> </body> </html>
2. Use the unbind() function
The unbind() function removes the event handler of the selected element.
ubind() works with any event handler attached via jQuery.
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script src="js/jquery-1.10.2.min.js"></script> <script> $(document).ready(function() { $("p").on("click", function() { $(this).slideToggle(); }); $("button").click(function() { $("p").unbind(); }); }); </script> </head> <body> <p>这是一个段落。</p> <p>这是另一个段落。</p> <p>点击任何段落可以令其消失。包括本段落。</p> <button>移除 on()添加的事件</button> </body> </html>
[Recommended learning: jQuery video tutorial, web front-end video】
The above is the detailed content of How to cancel the event bound by on() in jquery. For more information, please follow other related articles on the PHP Chinese website!