jquery event switch
Add events one by one
Need several events, add several times a day, each time the object calls the function
Link method
Method returns the current object
Switching method
The hover function receives two functions (such as A, B)
After clicking A, the event switches to B
After clicking B, the event switches to A
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
</head>
<script type="application/javascript">
$(function () {
//1:----------------原始方式----------------
/*
$("#myDiv").on("mouseover",function () {
$(this).css("backgroundColor","green");
});
$("#myDiv").on("mouseout",function () {
$(this).css("backgroundColor","blue");
});
*/
//2:----------------链式方式----------------
$("#myDiv").on("mouseover",function () {
$(this).css("backgroundColor","green");
}).on("mouseout",function () {
$(this).css("backgroundColor","blue");
});
//3:----------------切换方式----------------
/*
$("#myDiv").hover(function () {
$(this).css("backgroundColor","green");
},function () {
$(this).css("backgroundColor","blue");
});
*/
});
</script>
<body>
<div id="myDiv" style="width:300px;height:300px;background:red">鼠标移入变成绿色,
移出回复红色</div>
</body>
</html>
running result: