abstract：<!DOCTYPE html /><html> <head> <meta charset="utf-8" /> <title>jquery事件方法</title>
<!DOCTYPE html />
<html>
<head>
<meta charset="utf-8" />
<title>jquery事件方法</title>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<style type="text/css">
div{
width:100px;
height:100px;
background:#eee;
}
</style>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$('#one').focus(function(){ //當元素獲得焦點時
$('#one').css('background','blue')
})
$('#one').blur(function(){ //當元素失去焦點時
$('#one').css('background','red')
})
$('#tw').change(function(){ //當元素的值發(fā)生改變時
$('#tw').css('background','#ccc')
})
$('#cl').click(function(){ //當元素被單擊時
$('#one').css('width','250px')
})
$('#dbl').dblclick(function(){ //當元素被雙擊時
$('#tw').css('height','50px')
})
$('div').mouseover(function(){ //當鼠標在元素上方時
$('div').css('background','red')
})
$('div').mouseout(function(){ //當鼠標離開元素上方時
$('div').css('background','blue')
})
$('div').mouseup(function(){ //當鼠標在元素上方松開時
$('div').css('background','pink')
})
$('div').mousedown(function(){ //當鼠標在元素上方按下時
$('div').css('background','green')
})
$('#tt').mouseenter(function(){ //當鼠標穿過元素時
$('#tt').css('color','red')
})
$('#tt').mousemove(function(){ //當鼠標在元素中移動時
$('#tt').css('background','grey')
})
a=0
$(window).resize(function(){ //當窗口進行調(diào)整時，返回調(diào)整次數(shù)
$('h5').text(a++)
<!-- alert('fjakj ') -->
})
$(document).mouseover(function(aa){ //返回鼠標在文檔中距離左邊與上邊的位置
$('span').text('x:'+aa.pageX+'Y:'+aa.pageY)
})
$('#ss').hover( //當鼠標移上/移除元素時進行切換
function(){
$('#ss').css('background','red')
},function(){
$('#ss').css('background','blue')
}
)
$('#ii').click(function(){ //對元素進行顯示/隱藏切換
$('#rr').toggle().css('color','pink')
})
})
</script>
<input type="text" id="one" />
<br>
<input type="text" id="tw" />
<br>
<button id="cl">click</button>
<br>
<button id="dbl">dblclick</button>
<hr />
<div>阿斯蒂芬那里風景</div>
<br>
<p id="tt">阿斯蒂芬那里風景</p>
<br>
<h5></h5>
<span></span>
<br><br><br>
<a id="ss">esdfasdffasdfaf</a>
<br><br><br>
<h1 id="rr">hskdfalsdjasl</h1>
<button id="ii">click</button>
</body>
</html>
Correcting teacher：查無此人Correction time：2019-03-09 09:15:55
Teacher's summary：完成的不錯。js代碼，每行語句后面增加;號，養(yǎng)成好習慣。繼續(xù)就加油。