Come posso attivare un clic su un evento JavaScript

Ho un collegamento ipertestuale nella mia pagina. Sto cercando di automatizzare un numero di clic sul collegamento ipertestuale a scopo di test. Esiste un modo per simulare 50 clic sul collegamento ipertestuale utilizzando JavaScript?

<a href="#" target="_blank" onclick="javascript:Test("Test");">MSDN</a>

Sto cercando il trigger di evento onClick da JavaScript.

Esecuzione di un singolo clic su un elemento HTML: semplicemente element.click(). La maggior parte dei principali browser lo supporta .

Per ripetere il clic più di una volta: aggiungi un ID all'elemento per selezionarlo in modo univoco:

<a href="#" target="_blank" id="my-link" onclick="javascript:Test('Test');">Google Chrome</a>

e chiama il .click()metodo nel tuo codice JavaScript tramite un ciclo for:

var link = document.getElementById('my-link');
for(var i = 0; i < 50; i++)
   link.click();

AGGIORNARE

Questa era una vecchia risposta. Al giorno d'oggi dovresti semplicemente usare il clic . Per l'attivazione di eventi più avanzati, utilizzare dispatchEvent .

const body = document.body;

body.addEventListener('click', e => {
  console.log('clicked body');
});

console.log('Using click()');
body.click();

console.log('Using dispatchEvent');
body.dispatchEvent(new Event('click'));

Risposta originale

Ecco cosa uso: http://jsfiddle.net/mendesjuan/rHMCy/4/

Aggiornato per funzionare con IE9 +

/**
 * Fire an event handler to the specified node. Event handlers can detect that the event was fired programatically
 * by testing for a 'synthetic=true' property on the event object
 * @param {HTMLNode} node The node to fire the event handler on.
 * @param {String} eventName The name of the event without the "on" (e.g., "focus")
 */
function fireEvent(node, eventName) {
    // Make sure we use the ownerDocument from the provided node to avoid cross-window problems
    var doc;
    if (node.ownerDocument) {
        doc = node.ownerDocument;
    } else if (node.nodeType == 9){
        // the node may be the document itself, nodeType 9 = DOCUMENT_NODE
        doc = node;
    } else {
        throw new Error("Invalid node passed to fireEvent: " + node.id);
    }

     if (node.dispatchEvent) {
        // Gecko-style approach (now the standard) takes more work
        var eventClass = "";

        // Different events have different event classes.
        // If this switch statement can't map an eventName to an eventClass,
        // the event firing is going to fail.
        switch (eventName) {
            case "click": // Dispatching of 'click' appears to not work correctly in Safari. Use 'mousedown' or 'mouseup' instead.
            case "mousedown":
            case "mouseup":
                eventClass = "MouseEvents";
                break;

            case "focus":
            case "change":
            case "blur":
            case "select":
                eventClass = "HTMLEvents";
                break;

            default:
                throw "fireEvent: Couldn't find an event class for event '" + eventName + "'.";
                break;
        }
        var event = doc.createEvent(eventClass);
        event.initEvent(eventName, true, true); // All events created as bubbling and cancelable.

        event.synthetic = true; // allow detection of synthetic events
        // The second parameter says go ahead with the default action
        node.dispatchEvent(event, true);
    } else  if (node.fireEvent) {
        // IE-old school style, you can drop this if you don't need to support IE8 and lower
        var event = doc.createEventObject();
        event.synthetic = true; // allow detection of synthetic events
        node.fireEvent("on" + eventName, event);
    }
};

Nota che chiamare fireEvent(inputField, 'change');non significa che cambierà effettivamente il campo di input. Il tipico caso d'uso per l' input.value="Something"attivazione di un evento change è quando si imposta un campo a livello di codice e si desidera chiamare i gestori di eventi poiché la chiamata non attiverà un evento change.

Che cosa

 l.onclick();

fa è esattamente chiamando la onclickfunzione di l, cioè se ne hai impostato uno con l.onclick = myFunction;. Se non hai impostato l.onclick, non fa nulla. In contrasto,

 l.click();

simula un clic e attiva tutti i gestori di eventi, aggiunti con l.addEventHandler('click', myFunction);, in HTML o in qualsiasi altro modo.

Mi vergogno abbastanza del fatto che ci siano così tante applicazioni parziali errate o non divulgate.

Il modo più semplice per farlo è tramite Chrome o Opera (i miei esempi useranno Chrome) utilizzando la console. Immettere il codice seguente nella console (generalmente in 1 riga):

var l = document.getElementById('testLink');
for(var i=0; i<5; i++){
  l.click();
}

Questo genererà il risultato richiesto

.click()non funziona con Android (guarda i documenti di mozilla , sezione mobile). Puoi attivare l'evento click con questo metodo:

function fireClick(node){
    if (document.createEvent) {
        var evt = document.createEvent('MouseEvents');
        evt.initEvent('click', true, false);
        node.dispatchEvent(evt);    
    } else if (document.createEventObject) {
        node.fireEvent('onclick') ; 
    } else if (typeof node.onclick == 'function') {
        node.onclick(); 
    }
}

Da questo post

Utilizzare un framework di test

Questo potrebbe essere utile - http://seleniumhq.org/ - Selenium è un sistema di test automatizzato per applicazioni web.

Puoi creare test usando il plugin IDE Selenium di Firefox

Attivazione manuale di eventi

Per attivare manualmente gli eventi nel modo corretto, dovrai utilizzare metodi diversi per browser diversi, el.dispatchEvento el.fireEventdove o elsarà il tuo elemento di ancoraggio. Credo che entrambi richiederanno la costruzione di un oggetto Event per il passaggio.

L'alternativa, non del tutto corretta, veloce e sporca sarebbe questa:

var el = document.getElementById('anchorelementid');
el.onclick(); // Not entirely correct because your event handler will be called
              // without an Event object parameter.

IE9 +

function triggerEvent(el, type){
    var e = document.createEvent('HTMLEvents');
    e.initEvent(type, false, true);
    el.dispatchEvent(e);
}

Esempio di utilizzo:

var el = document.querySelector('input[type="text"]');
triggerEvent(el, 'mousedown');

Fonte: https://plainjs.com/javascript/events/trigger-an-event-11/

Giusto avvertimento:

element.onclick()non si comporta come previsto. Esegue solo il codice all'interno onclick="" attribute, ma non attiva il comportamento predefinito.

Ho avuto un problema simile con il pulsante di opzione non impostato su controllato, anche se la onclickfunzione personalizzata funzionava bene. Ho dovuto aggiungere radio.checked = "true";per impostarlo. Probabilmente lo stesso vale e per altri elementi (dopo a.onclick()ci dovrebbe essere anche window.location.href = "url";)

Si prega di chiamare la funzione di trigger in qualsiasi punto e fare clic sul pulsante.

<a href="#" id="myBtn" title="" >Button click </a>

function trigger(){
    document.getElementById("myBtn").click();
}