Comment puis-je simuler un clic d'ancre via jquery ?

Question

J'ai un problème pour simuler un clic d'ancre via jQuery : Pourquoi ma thickbox apparaît-elle la première fois que je clique sur le bouton de saisie, mais pas la deuxième ou la troisième fois ?

Voici mon code :

<input onclick="$('#thickboxId').click();" type="button" value="Click me">

<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>

Cela fonctionne toujours lorsque je clique directement sur le lien, mais pas si j'essaie d'activer la boîte épaisse via le bouton de saisie. Ceci dans FF. Pour Chrome, cela semble fonctionner à chaque fois. Des conseils ?

Answer 1

Ce qui a marché pour moi, c'est :

$('a.mylink')[0].click()

Answer 2

Essayez d'éviter l'inlining de vos appels jQuery comme cela. Placez une balise script en haut de la page pour vous lier à la balise click événement :

<script type="text/javascript">
$(function(){
    $('#thickboxButton').click(function(){
        $('#thickboxId').click();
    });
});
</script>

<input id="thickboxButton" type="button" value="Click me">
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>

Editar:

Si vous essayez de simuler un utilisateur qui clique physiquement sur le lien, je ne pense pas que ce soit possible. Une solution de contournement consisterait à mettre à jour les paramètres du bouton click pour modifier le window.location en Javascript :

<script type="text/javascript">
$(function(){
    $('#thickboxButton').click(function(){
        window.location = $('#thickboxId').attr('href');
    });
});
</script>

Edit 2 :

Maintenant que je réalise que Thickbox est un widget jQuery UI personnalisé, j'ai trouvé les instructions suivantes aquí :

Instructions :

• Créez un élément de lien ( <a href> )

• Donnez au lien un attribut de classe avec une valeur de thickbox ( class="thickbox" )

• Dans le href du lien, ajoutez l'ancre suivante : #TB_inline

• Dans le href après l'attribut #TB_inline ajoutez la chaîne de requête suivante sur l'ancre :

  ?height=300&width=300&inlineId=myOnPageContent

• Modifiez les valeurs de height, width et inlineId dans la requête en conséquence (inlineID est la valeur ID de l'élément qui contient le contenu que vous souhaitez afficher dans une ThickBox.

• En option, vous pouvez ajouter modal=true à la chaîne de requête (par ex. #TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true ), de sorte que la fermeture d'une ThickBox nécessitera l'appel de la fonction tb_remove() à l'intérieur de la ThickBox. Voir l'exemple du contenu modal caché, où vous devez cliquer sur oui ou non pour fermer la ThickBox.

Answer 3

J'ai récemment découvert comment déclencher un événement de clic de souris via jQuery.

    <script type="text/javascript">
    var a = $('.path > .to > .element > a')[0];
    var e = document.createEvent('MouseEvents');
    e.initEvent( 'click', true, true );
    a.dispatchEvent(e);
    </script>

Answer 4

Cette approche fonctionne sur firefox, chrome et IE. j'espère que cela aidera quelqu'un :

var comp = document.getElementById('yourCompId');
try { //in firefox
    comp.click();
    return;
} catch(ex) {}
try { // in chrome
    if(document.createEvent) {
        var e = document.createEvent('MouseEvents');
        e.initEvent( 'click', true, true );
        comp.dispatchEvent(e);
        return;
    }
} catch(ex) {}
try { // in IE
    if(document.createEventObject) {
         var evObj = document.createEventObject();
         comp.fireEvent("onclick", evObj);
         return;
    }
} catch(ex) {}

Answer 5

Le titre de la question dit "Comment puis-je simuler un clic d'ancre dans jQuery ?". Eh bien, vous pouvez utiliser les méthodes "trigger" ou "triggerHandler", comme suit :

<script type="text/javascript" src="path/to/jquery.js"></script>
<script type="text/javascript" src="path/to/thickbox.js"></script>
<script type="text/javascript">
$(function() {
    $('#btn').click(function() {
        $('#thickboxId').triggerHandler('click');
    })
})
</script>
...
<input id="btn" type="button" value="Click me">
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>

Non testé, ce script actuel, mais j'ai utilisé trigger et al avant, et ils ont bien travaillé.

UPDATE
triggerHandler ne fait pas réellement ce que le PO veut. Je pense 1421968 fournit la meilleure réponse à cette question.