サマリー：好多的組合都覺得從中這些事件上轉(zhuǎn)發(fā)而成的 等于是我在js里面學(xué)了一次 又在jqury也學(xué)了一次 感覺比上次 是深入了很多 謝謝師太老師的詳細(xì)講解 <!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document
好多的組合都覺得從中這些事件上轉(zhuǎn)發(fā)而成的 等于是我在js里面學(xué)了一次 又在jqury也學(xué)了一次 感覺比上次 是深入了很多 謝謝師太老師的詳細(xì)講解
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
/* .red{color: pink}
.oks{font-weight: bold;font-size: 35px;} */
</style>
<script type="text/javascript"src="js/jquery-3.3.1.min.js"></script>
</head>
<body>
<script type="text/javascript">
//*不能與<body onload="">一起使用
//blur()當(dāng)元素失去焦點(diǎn)==onblur
// focus()當(dāng)元素獲得焦點(diǎn)
// change()當(dāng)元素的值發(fā)生改變的時(shí)候
// click()點(diǎn)擊事件
//dblclick()雙擊事件
$(document).ready(function(){
//$('input').blur(function(){ //blur當(dāng)元素失去焦點(diǎn) 例如鼠標(biāo)點(diǎn)擊上去 松開
//$('input').css('background','pink')
//})
//$('input').focus(function(){ //focus當(dāng)元素獲得的焦點(diǎn) 例如點(diǎn)上去就是獲得
//$('input').css('background','#ccc')
//})
//$('input').change(function(){ //當(dāng)元素的值發(fā)生改變 例如 在按鈕框輸入文字 會(huì)改變?cè)?/p>
//$('input').css('background','red')
//})
//$('button').click(function(){ //當(dāng)按鈕被點(diǎn)擊了觸發(fā) div里面的變化
//$('div').css('background','pink')
$('div').dblclick(function(){ //雙擊事件觸發(fā) 改變div里面的屬性
$(this).css('border-radius','50px')
})
})
//})
</script>
<input type="text" name="">
<div style="width: 150px;height: 150px;background-color: red;"></div>
<button>點(diǎn)擊</button>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
/* .red{color: pink}
.oks{font-weight: bold;font-size: 35px;} */
</style>
<script type="text/javascript"src="js/jquery-3.3.1.min.js"></script>
</head>
<body>
<script type="text/javascript">
// mouseover() 當(dāng)鼠標(biāo)指針位于元素上方時(shí)會(huì)發(fā)生mouseover事件
// mouseenter() 當(dāng)鼠標(biāo)指針穿過(guò)元素時(shí)會(huì)發(fā)生mouseenter事件
// mousemove() 當(dāng)鼠標(biāo)指針在指定的元素中移動(dòng)時(shí)，就會(huì)發(fā)生該事件
// mouseleave() 當(dāng)鼠標(biāo)指針離開元素時(shí)
// mouseout() 當(dāng)鼠標(biāo)指針從元素上移開時(shí)
// mousedown() 當(dāng)鼠標(biāo)指針移動(dòng)到元素上方并按下鼠標(biāo)按鍵時(shí)
// mouseup() 當(dāng)在元素上松開鼠標(biāo)按鍵時(shí)
// resize() 當(dāng)調(diào)整當(dāng)前瀏覽器窗口大小時(shí)
// pageX() 屬性是鼠標(biāo)指針的位置，相對(duì)于文檔的左邊緣 event.pageX event：必需 參數(shù)來(lái)自事件綁定函數(shù)。
// pageY() 屬性是鼠標(biāo)指針的位置，相對(duì)于文檔的上邊緣 event.pageY event：必需 參數(shù)來(lái)自事件綁定函數(shù)。
$(document).ready(function(){
$('b').mouseover(function(){ //當(dāng)指針放到上方時(shí) 觸發(fā)的事件
$('b').css('background-color','red')
})
$('i').mouseenter(function(){ // 指正穿過(guò)激發(fā)的事項(xiàng)
$('i').css('color','pink')
})
$('i').mouseleave(function(){ //當(dāng)指針離開的時(shí)候激發(fā)
$('i').css('background-color','red')
})
$(document).mousemove(function(cc){ //當(dāng)鼠標(biāo)指針位于敞口內(nèi)的值 聲明CC函數(shù)
$('span').text('x:'+cc.pageX+'y:'+cc.pageY) //鼠標(biāo)指針的位值用文本顯示出來(lái)
})
$(document).mouseleave(function(){ //當(dāng)鼠標(biāo)移除會(huì)話框顯示
$('p').css('background-color','red')
})
})
$(document).mouseout(function(){ //從元素上離開
$('ul').css('background-color','pink')
})
//$(document).mousedown(function(){ //鼠標(biāo)按鍵點(diǎn)擊
// $('div').css('color','pink')
//})
$(document).mouseup(function(){
$('div').css('background-color','red')
})
a=0
$(window).resize(function(){
$('b').text(a++)
})
</script>
<input type="text" name="">
點(diǎn)擊：<span></span>
<b>我的</b><br>
<i>他的</i><br>
<p>a</p>
<ul>aaaa</ul>
<div id="abc">在元素松開按鍵
</div><div id="acd"></div>
<div style="width: 150px;height: 150px;background-color: red;"></div>
<button>點(diǎn)擊</button>
</body>
</html>