快捷導(dǎo)航

jQuery中值得注意的trigger方法淺析

更新時(shí)間：2016年12月12日 11:34:18 作者：張君卓

在前端頁(yè)面開(kāi)發(fā)中,我們有時(shí)候希望能自定執(zhí)行一些人性化操作,比如鼠標(biāo)不用點(diǎn)擊自動(dòng)就能點(diǎn)擊等操作,利用傳統(tǒng)的js語(yǔ)言需要編寫復(fù)雜的代碼才能實(shí)現(xiàn)此功能,這時(shí)候我們使用jquery的trigger()方法就能輕松實(shí)現(xiàn)。本文就給大家詳細(xì)介紹了關(guān)于jQuery中值得注意的trigger方法。

介紹

trigger方法的功能是在所選擇的元素上觸發(fā)指定類型的事件,其調(diào)用的語(yǔ)法格式為:trigger(type,[data]) ,其中參數(shù)type為觸發(fā)事件的類型，參數(shù)data為可選項(xiàng)，表示在觸發(fā)事件時(shí),傳遞給函數(shù)的附件參數(shù).

常用模擬

有時(shí)，不需要進(jìn)行操作，也想模擬用戶操作達(dá)到某些效果。比如在用戶進(jìn)入界面后就觸發(fā)click事件，而不需要用戶去點(diǎn)擊。
在jquery中可以使用trigger完成。

$("#btn").trigger("click")//觸發(fā)id為btn的click事件

$("#btn").click()//簡(jiǎn)寫

觸發(fā)自定義事件

trigger不僅能觸發(fā)瀏覽器支持的這些事件，也可以觸發(fā)自定義的事件。比如，綁定一個(gè)名為clickMe的事件：

$("#btn").bind("clickMe",function(){
 //....
})

$("#btn").trigger("clickMe")//觸發(fā)該事件

傳遞數(shù)據(jù)

trigger(type,[data])

第一個(gè)參數(shù)指觸發(fā)的事件類型，第二個(gè)是要傳遞給事件處理函數(shù)的附加數(shù)據(jù)，以數(shù)組形式傳遞。通?？梢酝ㄟ^(guò)傳遞一個(gè)參數(shù)給回調(diào)函數(shù)來(lái)區(qū)別這次的事件是否為用戶觸發(fā)的。

 <button id="btn">按鈕</button>
 <p id="msg"></p>
 <script>
 $(function(){
  $('#btn').bind("clickMe",function(event,msg1,msg2){
  $("#msg").text(msg1+' '+msg2)
  })
  $('#btn').trigger("clickMe",["hello","jquery"])
 })
 </script>