ドキュメント

Events/unbind

From jQuery JavaScript Library

Jump to: navigation, search

« Back to Events

unbind[type][fn] )

This does the opposite of bind, it removes bound events from each of the matched elements.

Without any arguments, all bound events are removed. If the type is provided, all bound events of that type are removed. If the function that was passed to bind is provided as the second argument, only that specific event handler is removed.

You can also unbind custom events registered with bind.

jQuery also supports namespaced events. These allow you to trigger or unbind specific groups of bound handlers without having to reference them directly.

Arguments:
type (Optional)String,Event,Object
One or more event types separated by a space.
fn (Optional)Function
A function to unbind from the event on each of the set of matched elements.
Examples:

Can bind and unbind events to the colored button.

    function aClick() {
      $("div").show().fadeOut("slow");
    }
    $("#bind").click(function () {
      // could use .bind('click', aClick) instead but for variety...
      $("#theone").click(aClick)
                  .text("Can Click!");
    });
    $("#unbind").click(function () {
      $("#theone").unbind('click', aClick)
                  .text("Does nothing...");
    });

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  
  <script>
  $(document).ready(function(){
    
    function aClick() {
      $("div").show().fadeOut("slow");
    }
    $("#bind").click(function () {
      // could use .bind('click', aClick) instead but for variety...
      $("#theone").click(aClick)
                  .text("Can Click!");
    });
    $("#unbind").click(function () {
      $("#theone").unbind('click', aClick)
                  .text("Does nothing...");
    });

  });
  </script>
  <style>
  button { margin:5px; }
  button#theone { color:red; background:yellow; }
  </style>
</head>
<body>
  <button id="theone">Does nothing...</button>
  <button id="bind">Bind Click</button>
  <button id="unbind">Unbind Click</button>
  <div style="display:none;">Click!</div>
</body>
</html>

To unbind all events from all paragraphs, write:

$("p").unbind()

To unbind all click events from all paragraphs, write:

$("p").unbind( "click" )

To unbind just one previously bound handler, pass the function in as the second argument:

var foo = function () {
  // code to handle some kind of event
};

$("p").bind("click", foo); // ... now foo will be called when paragraphs are clicked ...

$("p").unbind("click", foo); // ... foo will no longer be called.

NameType