首頁 >web前端 >js教程 >用法分享:jQuery如何使用自動觸發事件trigger

用法分享:jQuery如何使用自動觸發事件trigger

巴扎黑
巴扎黑原創
2017-06-25 13:29:161370瀏覽

這篇文章主要介紹了jQuery如何使用自動觸發事件trigger,需要的朋友可以參考下

有時候,需要透過模擬使用者操作,來達到點擊的效果,例如使用者進入頁面後
就觸發click事件,而無需主動點擊。

例如以下程式碼:


<body>
  <a href="#" onclick="javascript:document.getElementById(&#39;d&#39;).innerHTML=&#39;x1&#39;">点击1</a>
  <a href="#" onclick="javascript:document.getElementById(&#39;d&#39;).innerHTML=&#39;x2&#39;">点击2</a>
  <a href="#" onclick="javascript:document.getElementById(&#39;d&#39;).innerHTML=&#39;x3&#39;">点击3</a>
  </br>
  <span id="d"></span>
</body>

實現效果為'點擊1'頁面上將顯示x1 ,'點擊2'頁面上顯示x2 …
但需要實作首次進入頁面為預設是'點擊1'

#在jQuery中,可以使用trigger()方法完成模擬運算。
例如可以使用下面的程式碼來觸發A連結的click事件。

$('a').first().trigger("click");

這樣當頁面載入完畢後,觸發第一個A連結的click事件,頁面將顯示x1

觸發自訂事件

trigger()方法不僅能觸發瀏覽器支援的具有相同名稱的事件,也可以觸發自訂名稱的事件。
例如為元素綁定一個」myEvent」的事件,jQuery程式碼如下:


#
$(&#39;#btn&#39;).bind("myEvent", function(){ 
  alert("自定义事件");
});

想要觸發這個事件,可以使用以下程式碼來實作:

$('#btn').trigger("myEvent");

#傳遞資料

trigger(type,[ data])方法有兩個參數,
第1個是事件物件或要觸發的事件類型,
第2個參數是傳遞給事件處理函數的附加參數,
以陣列形式傳遞。通常可以透過傳遞一個參數給
回呼函數來區別這次事件是程式碼觸發的還是使用者觸發的。

下面是一個傳遞資料的範例。


$(&#39;#btn&#39;).bind("myEvent", function(event,message1,message2){ 
  alert(message1 + "," + message2);
});
$(&#39;#btn&#39;).trigger("myEvent", ["Hello","World!"]);

以上就是jQuery自動觸發事件trigger的使用方法,希望對大家的學習有幫助。

以上是用法分享:jQuery如何使用自動觸發事件trigger的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn