Try It Editor
Tip: Press
Ctrl/⌘ + Enter
to Run
▶ Run
Reset
Copy
Download
Code
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>on() / one() / off()</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <button id="once">Click once</button> <button id="toggle">Toggle binding</button> <div id="out"></div> <script> $("#once").one("click", function(){ $("#out").append("once clicked\n"); }); function hello(){ $("#out").append("hello\n"); } $("#toggle").on("click", function(){ var bound = $("#toggle").data("bound"); if(bound){ $(document).off("click", hello); $("#out").append("off document click\n"); } else { $(document).on("click", hello); $("#out").append("on document click\n"); } $("#toggle").data("bound", !bound); }); </script> </body> </html>
Output