jquery点击来回切换
做个笔记偶尔用有时记不住
方法一：
<div id="test">
test
</div>
$('#test').mouseover(function () {
$(this).addClass('a')
}).mouseout(function () {
$(this).removeClass('a')
})
方法二：
<div class="people_state">设为管理员</div>
<div class="people_state">设为管理员</div>
<js>
$(".people_state").each(function() {
$(".people_state").bind("click");
$(".people_state").toggle(function() {
$(this).html("取消管理员");
},function() {
$(this).html("设为管理员");
})
});
方法三：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
div{
height: 600px;
width: 300px;
background-color: orange;
}
.a{
background-color: blue;
}
</style>
<title>Title</title>
<script src="jquery-3.1.1.min.js"></script>
</head>
<body>
<div id="d">
sakdas
</div>
</body>
<script>
$('#d').mouseover(function () {
// 俩个状态来回切换
$(this).toggleClass('a')
}).mouseout(function () {
$(this).toggleClass('a')
})
</script>
</html>
方法四：
<html>
<div class="people_state" res="0">设为管理员</div>
<div class="people_state" res="0">设为管理员</div>
<js>
$(".people_state").click(function() {
var i=$(this).attr("res");
if(i==0){
$(this).attr("res","1");
$(this).html("");
$(this).html("取消管理员");
}else{
$(this).attr("res","0");
$(this).html("");
$(this).html("设为管理员");
}
});
