主动触发事件 自定义事件 trigger 及其用法

1. 触发自定义事件方式

js、jq

 

2. jq 触发

2.1 默认支持的事件

$('#h').on('click',function(){

$(this).append('<p>p</p>')

})

 

$('#h').trigger('click');

 

$('#h').click();

 

2.2 自定义事件

$('#h').on('myclick',function(){

$(this).append('<p>p</p>')

})

 

$('#h').trigger('myclick');

 

3. js 触发

    // 首先需要提前定义好事件，并且注册相关的EventListener
    var myEvent = new CustomEvent('event_name', {
      detail: {
        title: 'This is title!'
      },
    });
    window.addEventListener('event_name', function (event) {
      console.log('得到标题为：', event.detail.title);
    });
    // 随后在对应的元素上触发该事件
    setInterval(function () {
      if (window.dispatchEvent) {
        window.dispatchEvent(myEvent);
      } else {
        window.fireEvent(myEvent);
      }

    }, 1000);

 

4. 相关文章

JQuery 自己主动触发事件

jQuery.trigger() 函数详解

js 自定义事件的两种方式

JS中自定义事件的使用与触发