1. 程式人生 > >jQuery 自動觸發事件的坑

jQuery 自動觸發事件的坑

有時候專案需求頁面載入完後,需要模擬使用者操作,自動點選按鈕。Jquery中可以使用trigger()方法模擬事件。

$(selector).trigger(event,[param1,param2,...])

event:必須,規定指定元素上要觸發的事件。可以是自定義事件和標準事件。

param1,param2,...可選。傳遞到事件處理程式的額外引數。
額外的引數對自定義事件特別有用。

例如,模擬點選事件可以用以下的語句

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

但是,trigger()方法有一個問題,trigger() 方法觸發被選元素上指定的事件以及事件的預設行為(比如表單提交)。某些情況下會帶來一些不必要的後果,然而大多數的部落格都都只說了trigger怎麼用,沒有講會帶來什麼問題。
這裡就需要介紹另外一個方法triggerHandler()

,triggerHandler() 不觸發事件的預設行為。

trigger()與 triggerHandler() 方法相比的不同之處:
  • 它不會引起事件(比如表單提交)的預設行為
  • .trigger() 會操作 jQuery 物件匹配的所有元素,而 .triggerHandler() 隻影響第一個匹配元素。
  • 由 .triggerHandler() 建立的事件不會在 DOM 樹中冒泡;如果目標元素不直接處理它們,則不會發生任何事情。

以下菜鳥教程中有詳細的程式碼參考
菜鳥教程線上編輯