Come faccio a fare clic programmaticamente su un elemento in JavaScript?

Question

In IE, posso semplicemente chiamare element.click () da JavaScript: come posso eseguire la stessa attività in Firefox? Idealmente mi piacerebbe avere un po 'di JavaScript che funzionasse altrettanto bene tra browser, ma se necessario avrò JavaScript per browser diverso per questo.

Answer 1

La document.createEvent documentazione dice che " Il metodo createEvent è obsoleto. Utilizza invece costruttori di eventi . "

Quindi dovresti usare questo metodo invece:

var clickEvent = new MouseEvent("click", {
    "view": window,
    "bubbles": true,
    "cancelable": false
});

e sparalo su un elemento come questo:

element.dispatchEvent(clickEvent);

come mostrato qui .

Answer 2

Per i link di Firefox sembrano essere "speciali". L'unico modo in cui sono riuscito a farlo funzionare è stato utilizzare createEvent descritto qui su MDN e chiama la funzione initMouseEvent. Anche se non ha funzionato completamente, ho dovuto dire manualmente al browser di aprire un collegamento ...

var theEvent = document.createEvent("MouseEvent");
theEvent.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
var element = document.getElementById('link');
element.dispatchEvent(theEvent);

while (element)
{
    if (element.tagName == "A" && element.href != "")
    {
        if (element.target == "_blank") { window.open(element.href, element.target); }
        else { document.location = element.href; }
        element = null;
    }
    else
    {
        element = element.parentElement;
    }
}

Answer 3

Utilizzando jQuery puoi fare esattamente la stessa cosa, ad esempio:

$("a").click();

Che farà clic su " " tutte le ancore sulla pagina.

Answer 4

element.click () è un metodo standard delineato da specifica DOM W3C . Mozilla's Gecko / Firefox segue lo standard e consente di chiamare questo metodo solo su INPUT elementi.

Answer 5

Stai cercando di seguire effettivamente il link o di attivare il clic? Puoi attivare un clic con qualcosa del genere:

var link = document.getElementById(linkId);
link.onclick.call(link);

Answer 6

Ecco una funzione operativa tra browser (utilizzabile anche per gestori di clic diversi):

function eventFire(el, etype){
    if (el.fireEvent) {
      el.fireEvent('on' + etype);
    } else {
      var evObj = document.createEvent('Events');
      evObj.initEvent(etype, true, false);
      el.dispatchEvent(evObj);
    }
}

Answer 7

Ho usato la funzione di KooiInc elencata sopra, ma ho dovuto usare due diversi tipi di input un 'pulsante' per IE e un 'submit' per FireFox. Non sono esattamente sicuro del perché, ma funziona.

// HTML

<input type="button" id="btnEmailHidden" style="display:none" />
<input type="submit" id="btnEmailHidden2" style="display:none" />

// in JavaScript

var hiddenBtn = document.getElementById("btnEmailHidden");

if (hiddenBtn.fireEvent) {
    hiddenBtn.fireEvent('onclick');
    hiddenBtn[eType]();
}
else {
    // dispatch for firefox + others
    var evObj = document.createEvent('MouseEvent');
    evObj.initEvent(eType, true, true);
    var hiddenBtn2 = document.getElementById("btnEmailHidden2");
    hiddenBtn2.dispatchEvent(evObj);
}

Ho cercato e provato molti suggerimenti, ma questo è ciò che ha funzionato. Se avessi ancora un po 'di tempo, mi sarebbe piaciuto indagare sul motivo per cui inviare lavori con FF e pulsante con IE, ma sarebbe un lusso in questo momento, quindi al prossimo problema.