在jquery中,可以使用off()
方法移除元素绑定的事件处理程序。
.off( events [, selector ] )
-
events
类型: PlainObject
一个对象的字符串键所代表的一个或多个空格分隔的事件类型和可选的命名空间,值表示先前事件绑定的处理函数。
-
selector
类型: String
一个选择器,当绑定事件处理程序时,先前传递给
.on()
的那个。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<script>
$(function () {
$('#btn1').bind('click',function () {
alert('clicked button1')
})
$('#btn2').on('click',function () {
alert('clicked button2')
})
$('#remove1').on('click',function () {
$('#btn1').off('click')
alert('移除了button1的click事件')
})
$('#remove2').on('click',function () {
$('button').off('click')
alert('移除了所有按钮的click事件')
})
})
</script>
</head>
<body>
<button id="btn1">button1</button>
<button id="btn2">button2</button>
<button id="remove1">移除button1的click事件</button>
<button id="remove2">移除所有按钮的click事件</button>
</body>
</html>
只执行一次就解绑的方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<script>
$(function () {
$('#one').one('click',function () {
alert('哈哈,只能点一次')
})
})
</script>
</head>
<body>
<button id="one">只能点击一次</button>
</body>
</html>
禁用一些元素,也可解除事件绑定
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery.min.js"></script>
<script>
$(function () {
$('#btn1').click(function () {
alert($(this).text())
})
$('#btn2').click(function () {
$('#btn1').attr('disabled',"true")
})
})
</script>
</head>
<body>
<button id="btn1">click me</button>
<button id="btn2">禁用button1</button>
</body>
</html>