当前位置: 首页>>代码示例 >>用法及示例精选 >>正文

JQuery .undelegate()用法及代码示例


用法 
.undelegate() => jQuery

不推荐使用的版本：3.0

说明：根据一组特定的根元素，从与当前选择器匹配的所有元素的事件中删除一个处理程序。

  • 添加的版本：1.4.2.undelegate()

    • 此签名不接受任何参数。

  • 添加的版本：1.4.2.undelegate( selector, eventType )

    • selector
      类型：String
      用于过滤事件结果的选择器。
    • eventType
      类型：String
      包含 JavaScript 事件类型的字符串，例如 "click" 或 "keydown"

  • 添加的版本：1.4.2.undelegate( selector, eventType, handler )

    • selector
      类型：String
      用于过滤事件结果的选择器。
    • eventType
      类型：String
      包含 JavaScript 事件类型的字符串，例如 "click" 或 "keydown"
    • handler
      类型：Function(Event eventObject)
      触发事件时执行的函数。

  • 添加的版本：1.4.3.undelegate( selector, events )

    • selector
      类型：String
      用于过滤事件结果的选择器。
    • events
      类型：PlainObject
      一个或多个事件类型的对象和以前绑定的函数以解除绑定。

  • 添加的版本：1.6.undelegate( namespace )

    • namespace
      类型：String
      一个包含命名空间的字符串，用于取消绑定所有事件。

从 jQuery 3.0 开始，.undelegate() 已被弃用。自 jQuery 1.7 起，它被 .off() 方法取代，因此不鼓励使用它。

.undelegate() 方法是一种删除已使用 .delegate() 绑定的事件处理程序的方法。

例子：

可以将事件绑定和取消绑定到彩色按钮。

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>undelegate demo</title>
  <style>
  button {
    margin: 5px;
  }
  button#theone {
    color: red;
    background: yellow;
  }
  </style>
  <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</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>
 
<script>
function aClick() {
  $( "div" ).show().fadeOut( "slow" );
}
$( "#bind" ).click(function() {
  $( "body" )
    .delegate( "#theone", "click", aClick )
    .find( "#theone" ).text( "Can Click!" );
});
$( "#unbind" ).click(function() {
  $( "body" )
    .undelegate( "#theone", "click", aClick )
    .find( "#theone" ).text( "Does nothing..." );
});
</script>
 
</body>
</html>

演示：

要从所有段落中取消绑定所有委托事件，请编写：

$( "p" ).undelegate();

要从所有段落中取消绑定所有委托的单击事件，请编写：

$( "p" ).undelegate( "click" );

要取消对一个先前绑定的处理程序的委托，请将函数作为第三个参数传入：

var foo = function () {
  // Code to handle some kind of event
};
 
// ... Now foo will be called when paragraphs are clicked ...
$( "body" ).delegate( "p", "click", foo );
 
// ... foo will no longer be called.
$( "body" ).undelegate( "p", "click", foo );

通过命名空间解除所有委托事件的绑定：

var foo = function() {
  // Code to handle some kind of event
};
 
// Delegate events under the ".whatever" namespace
$( "form" ).delegate( ":button", "click.whatever", foo );
 
$( "form" ).delegate( "input[type='text'] ", "keypress.whatever", foo );
 
// Unbind all events delegated under the ".whatever" namespace
$( "form" ).undelegate( ".whatever" );

相关用法


注：本文由纯净天空筛选整理自jquery.com大神的英文原创作品 .undelegate()。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。