同學(xué)們在使用原生JavaScript開發(fā)的時(shí)候經(jīng)常會用到一些事件來觸發(fā)效果,例如onclick、onload等等,下面小千就給大家詳細(xì)介紹一下他們的功能和使用案例,喜歡的話記得收藏起來。
一、onblur--對象失去焦點(diǎn)時(shí)觸發(fā)
這時(shí)候當(dāng)in2這個(gè)元素失去焦點(diǎn)時(shí),就可以獲取到用戶的輸入值。
二、onchange--當(dāng)輸入框內(nèi)容發(fā)生改變時(shí)觸發(fā)
當(dāng)用戶本次輸入的值與上次輸入的值不一樣時(shí),這是觸發(fā)這個(gè)事件,可以獲取到用戶最新輸入的值。
三、onclick--點(diǎn)擊事件
這張圖片被點(diǎn)擊時(shí)就會標(biāo)稱想要的大小。
四、ondbclick--雙擊事件
這個(gè)div就會在雙擊的時(shí)候變成紅色的背景。
五、onfocus--獲取焦點(diǎn)事件
In2這個(gè)輸入框在獲取到焦點(diǎn)的同時(shí),還可以獲取到in1輸入框的內(nèi)容。
六、onkeyup--鍵盤彈起事件
在這個(gè)輸入框中輸入任何字母時(shí),都可以根據(jù)鍵盤輸入實(shí)時(shí)獲取到輸入框的值,完成實(shí)時(shí)搜索的功能。
七、onload--頁面加載完成的事件
這個(gè)事件的主要目的是判斷頁面的元素是否已經(jīng)加載完成,如果加載完成,一般的dom操作就可以順利進(jìn)行了
八、onmouseover,onmouseout--兩個(gè)鼠標(biāo)事件
前一個(gè)是鼠標(biāo)覆蓋時(shí)調(diào)用,后一個(gè)是鼠標(biāo)離開時(shí)調(diào)用。當(dāng)鼠標(biāo)覆蓋這個(gè)div時(shí),div的背景會變成紅色,如果離開div則顯示藍(lán)色。
九、onselect--輸入值全部被選中時(shí)觸發(fā)
當(dāng)用戶雙擊input的輸入內(nèi)容時(shí),這個(gè)事件會觸發(fā),可以得到用戶之前的輸入值,作為下一步的內(nèi)容。
以上就是常用的JavaScript事件代碼和案例的介紹了,建議同學(xué)們看完之后都自己上手敲一下看看效果,能夠更好的幫助記憶。最后如果你對前端開發(fā)感興趣的話不妨來千鋒HTML5大前端培訓(xùn)班了解一下我們的前端培訓(xùn)課程,現(xiàn)在咨詢更有免費(fèi)的前端學(xué)習(xí)資料可以領(lǐng)取,先到先得哦!