web-dev-qa-db-fra.com

Simuler un clic sur un élément 'a' à l'aide de javascript/jquery

J'essaie de simuler un clic sur un élément. HTML pour le même est comme suit

<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 dessus. j'ai essayé

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

Mais sa ne fait rien

53
user2373137

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

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

86
André Dion

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

Le code de la fonction qui simule un 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);      
}
14
ihor marusyk

Utilisation de jQuery:

$ ('# gift-close'). click ();
13
Alex Guerra

Extrait de code ci-dessous!

Veuillez consulter ces documentations et exemples à l'adresse MDN et vous trouverez votre réponse. C’est la meilleure façon de le faire, je dirais.

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

Evénement de répartition (exemple)

Tiré de 'Dispatch Event (example)' - Lien HTML (simuler un 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 le ferais (2017 ..):

En utilisant simplement 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>

7
ravo10

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. Parmi les moyens possibles de s’assurer que:

  1. Exécutez votre code à partir d'un gestionnaire 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 de script qui est after l'élément du code source HTML.

Alors:

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

Utilisez ce code pour cliquer:

$("#gift-close").click();
2
Farid Imranov

Essayez d'ajouter une fonction dans la méthode click()

$('#gift-close').click(function(){
  //do something here
});

Cela a fonctionné pour moi avec une fonction assignée à l'intérieur de la méthode click () plutôt que de la garder vide.

0
Neo