iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 30
0
自我挑戰組

CSS、JS-30天研究筆記系列 第 31

【day30】JQ關於事件3

  • 分享至 

  • xImage
  •  

關於「模擬操作」

  • 指當網頁載入完畢後,可以自行點擊一個按鈕觸發一個事件,類比用戶行為的操作而不需用戶點擊。
  • 使用.trigger方法或.triggerHandler()方法

一、使用方式

  1. 模擬用戶點擊行為
$('input').trigger('click');
  1. 也可以合併兩個方法
$('input').click(function () { alert('xxxxx'); }).trigger('click');
  1. 觸發自訂的事件
$('input').bind('myEvent', function () { alert('自訂事件!'); }).trigger('myEvent');

二、.trigger方法與.triggerHandler()方法的差異

  1. 是否觸發默認行為
$('form').trigger('submit'); //模擬用戶執行提交,並跳轉到執行頁面 $('form').triggerHandler('submit'); //模擬用戶執行提交,並阻止的默認行為
  1. 影響元素數量:
    triggerHandler()方法只會影響第一個匹配到的元素,而.trigger()會影響所有。
  2. 返回值與是否鏈式連綴調用
    .triggerHandler()方法會返回當前事件執行的返回值,如果沒有返回值,則返回 undefined(不能鏈式連綴調用);而.trigger()則返回當前包含事件觸發元素的 jQuery 物件(方便鏈式連綴調用)。
  3. 泡冒
    trigger()創建的事件會冒泡;.triggerHandler()不會冒泡。

上一篇
【day30】JQ關於事件2
系列文
CSS、JS-30天研究筆記31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言