2017-12-26jQuery unbind() 方法

您现在的位置是: 首页 > WEB前端 > jQuery unbind() 方法

340次阅读


unbind()函数用于移除匹配元素上绑定的一个或多个事件的事件处理函数

unbind()函数主要用于解除由bind()函数绑定的事件处理函数。

该函数属于jQuery对象(实例)。

bind()的反向操作,从每一个匹配的元素中删除绑定的事件。

文档地址: http://jquery.cuishifeng.cn/unbind.html


一、示例代码一


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>jQuery unbind() 方法</title> 
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("p").click(function(){
    $(this).slideToggle();
  });
  $("button").click(function(){
    $("p").unbind();
  });
});
</script>
</head>
<body>

<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
<p>点击任意段落(p 元素),该段落就会消失。</p>
<button>移除所有段落(p 元素)的事件句柄</button>

</body>
</html>



二、示例代码二


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>jQuery unbind() 方法</title> 
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js">
</script>
<script>
function alertMe()
{
	alert("Hello World!");
}
$(document).ready(function(){
  $("p").click(alertMe);
  $("button").click(function(){
    $("p").unbind("click",alertMe);
  });
});
</script>
</head>
<body>

<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
<p>点击任意一个p元素来触发 alert 弹窗。</p>
<button>移除 p 元素的 click 事件的执行函数 alertMe</button>

</body>
</html>


注意1: 如果未规定参数,则 unbind() 方法会删除指定元素的所有事件处理程序。

注意2: unbind() 方法适用于任意由 jQuery 添加的事件处理程序。

注意3: jQuery 3.0中已弃用此方法,请用 off() 代替。