Come attivare un clic su un collegamento utilizzando jQuery

239

Ho un link:

<ul id="titleee" class="gallery">
  <li>
    <a href="#inline" rel="prettyPhoto">Talent</a>
  </li>
</ul>

e sto cercando di attivarlo usando:

$(document).ready(function() {
  $('#titleee').find('a').trigger('click');
});

Ma non funziona

Ho anche provato: $('#titleee a').trigger('click');

Modifica :

Ho davvero bisogno di innescare qualunque cosa venga chiamata qui <a href="#inline" rel="prettyPhoto">

jquery triggers click

— Patrioticcow
fonte

7

location.href($('#titleee').find('a').attr("href"));?

— Sylvain,

3

o anche $ ('ul.gallery'). find ('li> a'). trigger ('click');

— Carney,

114

Ragazzi. La vera risposta è così semplice. $('#titleee a')[0].click();. In altre parole, utilizzare il metodo di clic DOM, non quello di jQuery. Migliora Graham Hotchkiss !

— Roman Starkov,

5

@romkyns no non è giusto perché apre un pop-up invece di una nuova scheda. ma fare clic su un intervallo fittizio all'interno di questo tag 'a' serve allo scopo

— Shishir Arora,

1

Se stai tentando di attivare un evento sull'ancora, il codice che hai funzionerà. $('ul#titleee li a[href="#inline"]').click();

— Anand Pal,

309

Se stai provando a innescare un evento sull'ancora, allora il codice che hai funzionerà Ho ricreato il tuo esempio in jsfiddle con un eventHandler aggiunto in modo da poter vedere che funziona:

$(document).on("click", "a", function(){
    $(this).text("It works!");
});

$(document).ready(function(){
    $("a").trigger("click");
});

Stai cercando di indurre l'utente a navigare verso un certo punto della pagina web facendo clic sull'ancoraggio o stai tentando di attivare eventi associati ad esso? Forse non hai effettivamente associato correttamente l'evento click all'evento?

Anche questo:

$('#titleee').find('a').trigger('click');

è l'equivalente di questo:

$('#titleee a').trigger('click');

Non è necessario chiamare find. :)

— Kit Sunde
fonte

16

@Kit .find () è un selettore più veloce di quello che stai proponendo, fai un benchmark se non sei d'accordo ma la tua proposta lo rallenta. positivamente :-)

— Ady Ngom,

14

@mashappslabs - Va bene. Sono felice per te se senti la necessità di fare premature e micro ottimizzazioni, non importa quanto sia vero. :)

— Kit Sunde,

5

@Kit ... quindi quando fai una dichiarazione come "non c'è bisogno di chiamare find", non rientra nel regno dell'ottimizzazione prematura ?? Penso di si, ma sembra essere più lento di quanto inizialmente proposto. Non sto rispondendo per motivi di discussione, ma per uno sforzo concertato per migliorare ciò che tutti amiamo fare. Spero che questo esca bene :-)

— Ady Ngom,

5

@mashappslabs - Dopo aver visto jsperf.com per la prima volta, ho pensato di tornare e dire che hai ragione, il tuo metodo è più veloce nel caso generale. Solo Opera è più lenta. jsperf.com/jquery-selector-perf-right-to-left/32

— Kit Sunde

9

Stranamente, quanto sopra non funziona per me, ma la risposta di @GrahamHotchkiss lo fa.

— Oliver,

210

Siamo spiacenti, ma il gestore dell'evento non è davvero necessario. Ciò di cui hai bisogno è un altro elemento all'interno del tag su cui fare clic.

<a id="test1" href="javascript:alert('test1')">TEST1</a>
<a id="test2" href="javascript:alert('test2')"><span>TEST2</span></a>

jquery:

$('#test1').trigger('click'); // Nothing
$('#test2').find('span').trigger('click'); // Works
$('#test2 span').trigger('click'); // Also Works

Questo è tutto su ciò che stai facendo clic e non è il tag ma la cosa al suo interno. Sfortunatamente, il testo non sembra essere riconosciuto da JQuery, ma lo è da vanilla javascript:

document.getElementById('test1').click(); // Works!

O accedendo all'oggetto jQuery come un array

$('#test1')[0].click(); // Works too!!!

— Graham Hotchkiss
fonte

9

$ ('selector') [0] .click () gestirà in realtà almeno un caso che l'attivazione del gestore eventi non lo farà: fare in modo che il browser lo riconosca come un clic effettivo per attivare un collegamento del gestore protocollo. La chiamata del trigger sull'evento click non provoca l'avvio dell'applicazione associata. Grazie per averlo incluso nella tua risposta!

— Greg Pettit,

3

Sì, .click()è proprio quello di cui avevo bisogno!

— notacouch

3

$ ('# test2 span'). trigger ('click'); aiutato in quanto può aprire un URL in una nuova scheda ma $ ('# test1') [0] .click (); stava aprendo un istea pop-up.

— Shishir Arora,

Quando provo a gestire il clic sull'elemento di sfondo: $ ('# titleee a'). Trigger ('click'); -> Non funziona! $ ('# titleee a') [0] .click (); -> Funziona!

— 18

1

$ ( '# test1') [0] .Click (); è un salvatore. Grazie mille

— Amit Bisht,

18

Poiché questa domanda è classificata al primo posto in Google per "innescare un clic su un <a>elemento" e nessuna risposta menziona effettivamente come lo fai, ecco come lo fai:

$('#titleee a')[0].click();

Spiegazione: si attiva a clicksull'elemento html sottostante, non sull'oggetto jQuery .

Prego googler :)

— alex
fonte

2

"fai scattare un clic sull'elemento html sottostante, non sull'oggetto jQuery." - questo mi ha cliccato , grazie!

— Frish,

5

Con il codice che hai fornito, non puoi aspettarti che accada nulla. I secondo @mashappslabs: prima aggiungo un gestore eventi:

$("selector").click(function() {
    console.log("element was clicked"); // or alert("click");
});

quindi attiva il tuo evento:

$("selector").click(); //or
$("selector").trigger("click");

e dovresti vedere il messaggio nella tua console.

— Julz
fonte

5

Questo non funziona per me: se il selettore è "a" (tag HTML per i collegamenti, solo per essere chiari), la funzione anonima viene chiamata quando chiamo trigger, ma l'azione del tag non si verifica. È come se l'evento non si propagasse all'elemento DOM associato. La risposta di @GrahamHotchkiss è l'unica che funziona in modo affidabile per me.

— Oliver,

5

Se stai tentando di attivare un evento sull'ancora, il codice che hai funzionerà.

$(document).ready(function() {
  $('a#titleee').trigger('click');
});

O

$(document).ready(function() {
  $('#titleee li a[href="#inline"]').click();
});

O

$(document).ready(function() {
  $('ul#titleee li a[href="#inline"]').click();
});

— Anand Pal
fonte

3

Bene, devi prima impostare l'evento click, quindi puoi attivarlo e vedere cosa succede:

//good habits first let's cache our selector
var $myLink = $('#titleee').find('a');
$myLink.click(function (evt) {
  evt.preventDefault();
  alert($(this).attr('href'));
});

// now the manual trigger
$myLink.trigger('click');

— Ady Ngom
fonte

3

Questa è la demo su come attivare l'evento

<!DOCTYPE html>
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
        $("input").select(function(){
            $("input").after(" Text marked!");
        });
        $("button").click(function(){
            $("input").trigger("select");
        });
    });
    </script>
    </head>
    <body>

    <input type="text" value="Hello World"><br><br>

    <button>Trigger the select event for the input field</button>

    </body>
    </html>

— Harshad Hirapara
fonte

3

Per i collegamenti dovrebbe funzionare:

eval($(selector).attr('href'));

— Amin
fonte

2

Questo non risponde esattamente alla tua domanda, ma ti darà lo stesso risultato con meno mal di testa.

Ho sempre i miei metodi di chiamata degli eventi click che contengono tutta la logica che vorrei eseguire. In modo che posso semplicemente chiamare il metodo direttamente se voglio eseguire l'azione senza un clic reale.

— Matthew Vines
fonte

2

Dovresti chiamare il .click()metodo nativo dell'elemento o usare l' createEventAPI.

Per maggiori informazioni, visitare: https://learn.jquery.com/events/triggering-event-handlers/

— George Filippakis
fonte

6

Benvenuto in Stack Overflow! Mentre questo potrebbe essere un valido suggerimento per risolvere il problema, una buona risposta dimostra anche la soluzione. Si prega di modificare per fornire codice di esempio per mostrare quello che vuoi dire. In alternativa, considera invece di scrivere questo come commento.

— Toby Speight,