更新時(shí)間:2022-08-29 來源:黑馬程序員 瀏覽量:
IT就到黑馬程序員.gif)
在jQuery中,觸發(fā)事件有3種方式,第1種是調(diào)用事件方法,第2種是通過trigger()方法觸發(fā)事件,第3種是通過triggerHandler()方法觸發(fā)事件。下面我們分別進(jìn)行講解。
1.事件方法觸發(fā)事件
jQuery中的事件方法在調(diào)用時(shí)如果傳參數(shù),表示綁定事件,如果不傳參數(shù),表示觸發(fā)事件。以click()方法為例,示例代碼如下:
//綁定事件
$("div").click(function() {
alert("hello");
});
//觸發(fā)事件
$("div").click();上述代碼中,第6行代碼調(diào)用了click()方法,觸發(fā)了單擊事件。
2.trigger()方法觸發(fā)事件
使用migger()方法可以觸發(fā)指定事件,示例代碼如下。
//綁定事件
$("div").click(function() {
alert("hello");
});
//觸發(fā)事件
$("div").trigger("click");上述代碼中,第6行代碼調(diào)用了trigger()方法,參數(shù)click表示單擊事件。
3.triggerHandler()方法觸發(fā)事件
事件方法和trigger()方法在觸發(fā)事件時(shí),都會執(zhí)行元素的默認(rèn)行為,而triggerHandler()方法在觸發(fā)事件時(shí)不會執(zhí)行元素的默認(rèn)行為。下面我們通過代碼來演示。
<input type="text">
<script>
$("input").on("focus", function() {
$(this).val("你好嗎");
});
$("input").triggerHandler("focus"); //觸發(fā)事件
</script>在上述代碼中,第3~5行代碼為頁面中的input元素綁定焦點(diǎn)事件。第6行代碼觸發(fā)焦點(diǎn)事件。代碼執(zhí)行后,會發(fā)現(xiàn)input文本框沒有光標(biāo)閃爍,但第2行代碼也執(zhí)行了,文本框中的值變?yōu)椤澳愫脝帷?。而如果將?行的triggerHandler0方法換成focus0方法或者trigger0方法,則看到文本框中有光標(biāo)閃爍。像這個(gè)文本框中有光標(biāo)閃爍的現(xiàn)象,就是元素獲得焦點(diǎn)時(shí)會發(fā)生的默認(rèn)行為。由此可見,triggerHandler0方法不會執(zhí)行元素的默認(rèn)行為。
1024首播|39歲程序員逆襲記:不被年齡定義,AI浪潮里再迎春天
2025-10-241024程序員節(jié)丨10年同行,致敬用代碼改變世界的你
2025-10-24【AI設(shè)計(jì)】北京143期畢業(yè)僅36天,全員拿下高薪offer!黑馬AI設(shè)計(jì)連續(xù)6期100%高薪就業(yè)
2025-09-19【跨境電商運(yùn)營】深圳跨境電商運(yùn)營畢業(yè)22個(gè)工作日,就業(yè)率91%+,最高薪資達(dá)13500元
2025-09-19【AI運(yùn)維】鄭州運(yùn)維1期就業(yè)班,畢業(yè)14個(gè)工作日,班級93%同學(xué)已拿到Offer, 一線均薪資 1W+
2025-09-19【AI鴻蒙開發(fā)】上海校區(qū)AI鴻蒙開發(fā)4期5期,距離畢業(yè)21天,就業(yè)率91%,平均薪資14046元
2025-09-19