web-dev-qa-db-fra.com

Faux "clic" pour activer une méthode onclick

J'ai un élément avec une méthode onclick.

Je voudrais activer cette méthode (ou: simuler un clic sur cet élément) dans une autre fonction.

Est-ce possible?

46
yoavf

Si vous utilisez JQuery, vous pouvez faire:

$('#elementid').click();
60
Eduardo Campañó

Une fois que vous avez sélectionné un élément, vous pouvez appeler click ()

document.getElementById('link').click();

voir: https://developer.mozilla.org/En/DOM/Element.click

Je ne me souviens pas si cela fonctionne sur IE, mais cela devrait. Je n'ai pas de machine Windows à proximité.

62
Ben

Je pourrais mal interpréter votre question, mais, oui, c'est possible. La façon dont je procéderais est la suivante:

var oElement = document.getElementById('elementId');   // get a reference to your element
oElement.onclick = clickHandler; // assign its click function a function reference

function clickHandler() {
    // this function will be called whenever the element is clicked
    // and can also be called from the context of other functions
}

Maintenant, chaque fois que cet élément est cliqué, le code dans clickHandler s'exécutera. De même, vous pouvez exécuter le même code en appelant la fonction à partir du contexte d'autres fonctions (ou même affecter clickHandler pour gérer les événements déclenchés par d'autres éléments)>

7
Tom
var clickEvent = new MouseEvent('click', {
  view: window,
  bubbles: true,
  cancelable: true
});
var element = document.getElementById('element-id'); 
var cancelled = !element.dispatchEvent(clickEvent);
if (cancelled) {
  // A handler called preventDefault.
  alert("cancelled");
} else {
  // None of the handlers called preventDefault.
  alert("not cancelled");
}

element.dispatchEvent est pris en charge dans tous les principaux navigateurs. L'exemple ci-dessus est basé sur un exemple simulateClick() fonction sur MDN .

4
Jonathan Lonowski

Si vous utilisez jQuery, vous devez utiliser le .trigger fonction, ce serait donc quelque chose comme:

element.trigger('click');

http://api.jquery.com/trigger/

4
rink.attendant.6

Ceci est un exemple parfait où vous devez utiliser une bibliothèque javascript comme Prototype ou JQuery pour résumer les différences entre les navigateurs.

3
RedFilter

appelez simplement "onclick"!

voici un exemple html:

<div id="c" onclick="alert('hello')">Click me!</div>
<div onclick="document.getElementById('c').onclick()">Fake click the previous link!</div>
2
hasen

Pour IE il y a la méthode fireEvent () . Je ne sais pas si cela fonctionne pour les autres navigateurs.

2
Vilx-

En utilisant javascript, vous pouvez déclencher click() et focus() comme dans l'exemple ci-dessous

document.addEventListener("click", function(e) {
  console.log("Clicked On : ",e.toElement);
},true);
document.addEventListener('focus',function(e){
  console.log("Focused On : ",e.srcElement);
},true);

document.querySelector("#button_1").click();
document.querySelector("#input_1").focus();
<input type="button" value="test-button" id="button_1">
<input type="text" value="value 1" id="input_1">
<input type="text" value="value 2" id="input_2">
2
Niklesh Raut

Je n'ai pas utilisé jQuery, mais IIRC, la première méthode mentionnée ne déclenche pas le gestionnaire onclick.

J'appellerais directement la méthode onclick associée, si vous n'utilisez pas les détails de l'événement.

1
Can Berk Güder