abstrak:第一遍 blur()當元素失去焦點==onblur focus()當元素獲得焦點 change()當元素的值發(fā)生改變的時候 click()點擊事件 dblclick()雙擊事件 mouseover() 當鼠標指針位于元素上方時會發(fā)生mouseover事件 mouseenter() 當鼠標指針穿過元素時會發(fā)生mouseenter事件 mousemove
第一遍 blur()當元素失去焦點==onblur focus()當元素獲得焦點 change()當元素的值發(fā)生改變的時候 click()點擊事件 dblclick()雙擊事件 mouseover() 當鼠標指針位于元素上方時會發(fā)生mouseover事件 mouseenter() 當鼠標指針穿過元素時會發(fā)生mouseenter事件 mousemove() 當鼠標指針在指定的元素中移動時,就會發(fā)生該事件 mouseleave() 當鼠標指針離開元素時 mouseout() 當鼠標指針移動到元素上方并按下鼠標按鍵時 mouseup() 當在元素上松開鼠標按鍵時 resize() 當調(diào)整當前瀏覽器窗口大小時 pageX() 屬性是鼠標指針的位置,相對于文檔的左邊緣 event.pageX event:必需 參數(shù)來自事件綁定函數(shù) pageY() 屬性是鼠標指針的位置,相對于文檔的上邊緣 event.pageY event:必需 參數(shù)來自事件綁定函數(shù)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>hiki</title> <script type="text/javascript" src="jquery-3.3.1.min.js"></script> </head> <body> <script type="text/javascript"> //在Jquery中是以調(diào)用事件函數(shù)的形式來觸發(fā)事件的,如js中的onclick事件,在Jquery用click()來替代 //簡單的理解:事件方法會觸發(fā)匹配元素的事件,或者將函數(shù)綁定到所有匹配元素的某個事件 //ready() 當我們的DOM已經(jīng)加載完成,頁面已經(jīng)加載完,觸發(fā)的事件==js的onload // $(document).ready(function(){ // }) //不能與<body onload="">一起使用 // blur()當元素失去焦點==onblur // focus()當元素獲得的焦點 // change()當元素的值發(fā)生改變的時候 // click()點擊事件 // dblclick()雙擊事件 // mouseover() 當鼠標指針位于元素上方時會發(fā)生mouseover事件 // mouseenter() 當鼠標指針穿過元素時會發(fā)生mouseenter事件 // mousemove() 當鼠標指針在指定的元素中移動時,就會發(fā)生該事件 // mouseleave() 當鼠標指針離開元素時 // mouseout() 當鼠標指針移動到元素上方并按下鼠標按鍵時 // mouseup() 當在元素上松開鼠標按鍵時 // resize() 當調(diào)整當前瀏覽器窗口大小時 // pageX() 屬性是鼠標指針的位置,相對于文檔的左邊緣 event.pageX event:必需 參數(shù)來自事件綁定函數(shù) // pageY() 屬性是鼠標指針的位置,相對于文檔的上邊緣 event.pageY event:必需 參數(shù)來自事件綁定函數(shù) // $(document).ready(function(){ // // $('input').blur(function(){ // // $('input').css('background','red') // // }) // // $('input').focus(function(){ // // $('input').css('background','blue') // // }) // // $('input').change(function(){ // // $('input').css('background','pink') // // }) // // $('button').click(function(){ // // $('div').css({'background':'pink','border-radius':'50px'}) // // }) // // $('div').dblclick(function(){ // // $(this).css({'background':'blue','border-radius':'10px'}) // // }) // }) $(document).ready(function(){ // $(document).mousemove(function(aa){ // $('span').text('x: '+aa.pageX+'y: '+aa.pageY) // }) a=0 $(window).resize(function(){ // alert('窗口被調(diào)整') $('b').text(a++) //瀏覽器大小調(diào)整的次數(shù) }) }) </script> <!-- <input type="text" name=""> <div style="width:100px;height:100px;background:red;margin-top:20px"></div><br> <button>點擊</button> --> <div> 當前鼠標的位置:<span> </span> </div> <div> 當前頁面被調(diào)整的次數(shù):<b> </b> </div> </body> </html>
blur() blur() blur() 元素失去焦點
focus() focus() focu() 元素獲得焦點
change() change() change() 元素值改變時
click() click() click() 點擊事件
dblclick() dblclick() dblclick() 雙擊事件
下方為鼠標指針事件
mouseover() mouseover() mouseover() 元素上方
mouseenter() mouseenter() mouseenter() 穿過元素
mousemove() mousemove() mousemove() 元素中移動
mouseleave() mouseleave() mouseleave() 離開元素
mouseout() mouseout() mouseout() 元素上方并按下鼠標按鍵時
mouseup() mouseup() mouseup() 元素上松開鼠標
resize() resize() resize() 瀏覽器窗口大小被調(diào)整時,也可以計數(shù)調(diào)整次數(shù)括號內(nèi)傳變量
pageX() pageX() pageX() 獲取x軸位置
pageY() pageY() pageY() 獲取y軸位置