Home >Web Front-end >Front-end Q&A >How to remove onclick event in jquery
Removal method: 1. Use "element object.removeAttr("onclick")" to remove the event defined inside the html tag; 2. Use "element object.unbind("click")" or "Element object.off("click")", removes the event bound by jquery event.
The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.
1. If the onclick event is defined inside the html tag, you need to use the removeAttr("onlick") method:
removeAttr() method removes one or more attributes from the selected element.
<div id="test" onclick="setOnclick">onclick事件</div>
<javascript>
$("#test").removeAttr("onclick");
</javascript>2. If the current click is an event bound by jquery event, you should use the unbind("click") method:
unbind() method to remove The event handler for the selected element.
This method can remove all or selected event handlers, or terminate the execution of the specified function when an event occurs.
This method can also unbind the event handler through the event object. This method is also used to unbind events within itself (such as deleting the event handler after the event has been triggered a certain number of times).
Note: If no parameters are specified, the unbind() method will remove all event handlers for the specified element.
Note: The unbind() method applies to any event handler added by jQuery.
Since jQuery version 1.7, the on() and off() methods are the preferred methods for adding and removing event handlers on elements.
// jquery 绑定事件
$('#test').click(function(){
alert("click");
})
// 使用unbind解除绑定
$("#test").unbind("click");The example is as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$('#button1').click(function(){
alert("click");
})
$("#button2").click(function(){
$("#button1").unbind();
});
});
</script>
</head>
<body>
<button id="button1">点击事件</button>
<button id="button2">移除点击事件</button>
</body>
</html>Click the first button to output the result:
After clicking the second button, it will move Except for the click event of the first button
Recommended related video tutorials:jQuery video tutorial
The above is the detailed content of How to remove onclick event in jquery. For more information, please follow other related articles on the PHP Chinese website!