Jquery dispatchEvent包装器方法

时间:2013-09-16 08:49:15

标签: javascript jquery html events

jquery中有dispatchEvent的包装器方法或库吗?我一直在stackoverflow上寻找这个,但我发现的最接近的方法是jquery的trigger(),它似乎只触发jquery事件监听器。当然我可以自己使用dispatchEvent,但我想使用jquery使我的代码更容易阅读。

我正在写一个greasemonkey脚本,我想向一些匿名事件监听器发送一个事件。页面本身不是用jquery编写的。

这是一个jsfiddle链接,用于解释我想要完成的任务:http://jsfiddle.net/Zx3CA/

JS:

function log(s){
    document.getElementById('log').innerHTML+=s+'<br/>';
}

$(function(){
    //code on the page, which shouldn't be changed
    //start
    document.getElementById('link').addEventListener('click',function(){
        log('click detected');
    },false);
    //end

    $('#triggerClickJQuery').on('click',function(){
        $('#link').trigger('click');
    });

    $('#triggerClickJS').on('click',function(){
        var event=document.createEvent('MouseEvents');
        event.initMouseEvent('click',true,true,null,-1,-1,-1,-1,0,true,false,false,true,0,null);
        $('#link').get(0).dispatchEvent(event);
    });
});

HTML:

<body>

<a id="link" href="javascript:void(0);">Link</a><br/>
<a id="triggerClickJQuery" href="javascript:void(0);">Trigger Click JQuery</a><br/>
<a id="triggerClickJS" href="javascript:void(0);">Trigger Click JavaScript</a><br/>

<div id="log"></div>

</body>

提前致谢。

1 个答案:

答案 0 :(得分:10)

自定义事件的jQuery(最高1.10.1)中trigger的实现不会触发本机事件,因此您无法通过{{1}监听它或者在同一页面上加载了不同版本的addEventListener

此错误及其所有用例都在此处详细记录:http://bugs.jquery.com/ticket/11047

作为一种解决方案,您可以使用此plugin来检查浏览器是否支持触发自定义本机事件并在可用时使用它。

https://github.com/sandeep45/betterTrigger