Simuler un clic sur l'élément 'a' en utilisant javascript/jquery

Question

J'essaie de simuler un clic sur un élément. Le code HTML est le suivant

<a id="gift-close" href="javascript:void(0)" class="cart-mask-close p-abs" onclick="_gaq.push(['_trackEvent','voucher_new','cart',$(this).attr('rel')+'-mask_x_button-inaction']);" rel="coupon">&nbsp;</a>

Comment puis-je simuler un clic sur celui-ci ? J'ai essayé

document.getElementById("gift-close").click();

Mais il ne fait rien

Answer 1

Utilisation de jQuery : $('#gift-close').trigger('click');

Utilisation de JavaScript : document.getElementById('gift-close').click();

Answer 2

Utilisation de jQuery :

$('#gift-close').click();

Answer 3

Essayez d'utiliser document.createEvent décrite ici https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent

Le code de la fonction qui simule le clic devrait ressembler à ceci :

function simulateClick() {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);
  var a = document.getElementById("gift-close"); 
  a.dispatchEvent(evt);      
}

Answer 4

Extrait de code en dessous !

Veuillez consulter ces documentations et exemples à l'adresse suivante MDN et vous trouverez votre réponse. Je pense que c'est la meilleure façon de procéder.

Création et déclenchement d'événements

Événement d'envoi (exemple)

Extrait du lienHTML 'Dispatch Event (example)' (simuler le clic) :

function simulateClick() {

  var evt = document.createEvent("MouseEvents");

  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);

  var cb = document.getElementById("checkbox"); 
  var canceled = !cb.dispatchEvent(evt);

  if(canceled) {
    // A handler called preventDefault
    alert("canceled");
  } else {
    // None of the handlers called preventDefault
    alert("not canceled");
  }
}

Voici comment je procéderais (2017 ..) :

Il suffit d'utiliser MouseEvent .

function simulateClick() {

    var evt = new MouseEvent("click");

    var cb = document.getElementById("checkbox");
    var canceled = !cb.dispatchEvent(evt);

    if (canceled) {
        // A handler called preventDefault
        console.log("canceled");
    } else {
        // None of the handlers called preventDefault
        console.log("not canceled");
    }
}

document.getElementById("button").onclick = evt => {

    simulateClick()
}

function simulateClick() {

    var evt = new MouseEvent("click");

    var cb = document.getElementById("checkbox");
    var canceled = !cb.dispatchEvent(evt);

    if (canceled) {
        // A handler called preventDefault
        console.log("canceled");
    } else {
        // None of the handlers called preventDefault
        console.log("not canceled");
    }
}

<input type="checkbox" id="checkbox">
<br>
<br>
<button id="button">Check it out, or not</button>

Answer 5

Le code que vous avez déjà essayé :

document.getElementById("gift-close").click();

...devrait fonctionner tant que l'élément existe réellement dans le DOM au moment où vous l'exécutez. Voici quelques moyens possibles de s'en assurer :

1. Exécutez votre code à partir d'un onload pour la fenêtre. http://jsfiddle.net/LKNYg/
2. Exécutez votre code à partir d'un gestionnaire de document prêt si vous utilisez jQuery. http://jsfiddle.net/LKNYg/1/
3. Placez le code dans un bloc script qui est après l'élément dans la source html.

Ainsi :

$(document).ready(function() {
    document.getElementById("gift-close").click();
    // OR
    $("#gift-close")[0].click();
});