學(xué)了mouseover、mouseout、mouseenter、mouseleave事件,也理解了四個(gè)事件的相同點(diǎn)與不同點(diǎn),現(xiàn)在可以用來給元素做一個(gè)簡(jiǎn)單的切換效果
在元素上移進(jìn)移出切換其換色,一般通過2個(gè)事件配合就可以達(dá)到,這里用mouseenter與mouseleave,這樣可以避免冒泡問題
$(ele).mouseenter(function(){ $(this).css("background", '#bbffaa'); }) $(ele).mouseleave(function(){ $(this).css("background", 'red'); })
這樣目的是達(dá)到了,代碼稍微有點(diǎn)多,對(duì)于這樣的簡(jiǎn)單邏輯jQuery直接提供了一個(gè)hover方法,可以便捷處理
只需要在hover方法中傳遞2個(gè)回調(diào)函數(shù)就可以了,不需要顯示的綁定2個(gè)事件
$(selector).hover(handlerIn, handlerOut)
這個(gè)事件就是這么簡(jiǎn)單,具體參考下右邊代碼的操作:
在右邊代碼42行處,填入任務(wù)
調(diào)用一個(gè)jquery一個(gè)方法,可以直接將二個(gè)事件函數(shù)綁定到匹配元素上,分別當(dāng)鼠標(biāo)指針進(jìn)入和離開元素時(shí)被執(zhí)行。
hover
請(qǐng)驗(yàn)證,完成請(qǐng)求
由于請(qǐng)求次數(shù)過多,請(qǐng)先驗(yàn)證,完成再次請(qǐng)求
打開微信掃碼自動(dòng)綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報(bào)