javascriptfirefoxdom-eventsevent-dispatchingfirefox-5

Firefox 5 dispatchEvent in Firefox


I have some code that uses dispatchEvent to simulate clicks and the same exact code works fine in Chrome but doesn't work in Firefox. Here's the code:

var evt = document.createEvent("MouseEvents");
evt.initEvent("click",true,true);
jQuery("a:contains(Next)")[0].dispatchEvent(evt);

I'm clicking on a link that loads another page and the page loads fine in Chrome but Firefox does absolutely nothing when I run this code in Firebug or even when I execute it as a bookmarklet. I've also tried the long form of event initializing by setting all the options as shown on the MDC docs but that doesn't do anything. What exactly am I doing wrong here?


Solution

  • As your event looks to be a mouse event, you may rather try using a mouse event, like this example :

    var oEvt = (document.createEvent)? document.createEvent('MouseEvents') : document.createEventObject();    
           // W3C
            if (oEvt.initMouseEvent) 
                oEvt.initMouseEvent(
                    /* type*/            'mouseup',
                    /* bubble*/            true,
                    /* cancel*/            true,
                    /* AbstractView*/     window,
                    /* detail */        10,
                    /* screenX */        20,
                    /* screenY */        30, 
                    /* clientX */        40,
                    /* clientY */        50,
                    /* ctrlKey */        false,
                    /* altKey */        false,
                    /* shiftKey */        true,
                    /* metaKey */        false,
                    /* button */        0,
                    /* relatedTarget*/    null ) ;
            // MSIE
            else {
                    var oEvt = document.createEventObject(); 
                    oEvt.detail = 10;
                    oEvt.screenX = 20;
                    oEvt.screenY = 30;
                    oEvt.clientX = 40;
                    oEvt.clientY = 50;
                    oEvt.ctrlKey = false;
                    oEvt.altKey = false;
                    oEvt.shiftKey = true;
                    oEvt.metaKey = false;
                    oEvt.button = 0;
                    oEvt.relatedTarget = null;
            }
    

    See W3C Mouse event types

    I also wrote a tutorial in French language about firing DOM events ; I guess it's easy to get it translated.