JQuery kullanarak bir bağlantıya bir tıklama nasıl tetiklenir


239

Bir bağlantım var:

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

ve ben kullanarak tetiklemeye çalışıyorum:

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

Ama işe yaramıyor.

Ayrıca denedim: $('#titleee a').trigger('click');

Düzenle :

Aslında buraya ne denirse onu tetiklemem gerekiyor <a href="#inline" rel="prettyPhoto">


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

3
hatta $ ('ul.gallery'). find ('li> a'). tetikleyici ('klik');
CarneyCode

114
Adamlar. Gerçek cevap çok basit. $('#titleee a')[0].click();. Başka bir deyişle, jQuery yöntemini değil DOM tıklama yöntemini kullanın. Oyla Graham Hotchkiss !
Roman Starkov

5
@romkyns no yeni sekme yerine bir açılır pencere açması doğru değil. ancak bu 'a' etiketi içindeki kukla bir açıklığa tıklamak amaca hizmet eder
Shishir Arora

1
Bağlantıda bir olayı tetiklemeye çalışıyorsanız, sahip olduğunuz kod çalışır. $('ul#titleee li a[href="#inline"]').click();
Anand Pal

Yanıtlar:


309

Bağlantıda bir olayı tetiklemeye çalışıyorsanız, o zaman sahip olduğunuz kod çalışacak şekilde eklediğiniz eventHandler ile jsfiddle örneğinizi yeniden oluşturdum :

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

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

Bağlantıyı tıklatarak kullanıcının web sayfasında belirli bir noktaya gitmesine neden olmaya mı çalışıyorsunuz yoksa buna bağlı olayları tetiklemeye mi çalışıyorsunuz? Belki de tıklama etkinliğini etkinliğe başarıyla bağlamadınız mı?

Ayrıca bu:

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

buna eşdeğerdir:

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

Bulmaya gerek yok. :)


16
@Kit .find (), teklif ettiğinizden daha hızlı bir seçicidir, katılmıyorsanız bir kıyaslama yapın, ancak teklifiniz yavaşlar. Olumlu :-)
Ady Ngom

14
@mashappslabs - Sorun değil. Ne kadar doğru olursa olsun, erken ve mikro optimizasyon yapma ihtiyacı hissederseniz sizin için mutluyum. :)
Kit Sunde

5
@Kit ... yani "bulmaya gerek yok" gibi bir ifade yaparken, erken optimizasyon alanına düşmez ?? Bence öyle ama ilk başta önerilenden daha yavaş oluyor. Tartışma uğruna değil, hepimizin yapmayı sevdiğimiz şeylerde daha iyi olma çabası için cevap veriyorum. Umarım bu doğru gelir :-)
Ady Ngom

5
@mashappslabs - jsperf.com'u ilk kez gördükten sonra geri döneceğimi ve haklı olduğunu söylediğimi düşündüm, yönteminiz genel durumda daha hızlı. Sadece Opera daha yavaştır. jsperf.com/jquery-selector-perf-right-to-left/32
Kit Sunde

9
İşin garibi, yukarıdaki benim için çalışmıyor, ama @GrahamHotchkiss cevap işe yarıyor.
Oliver

210

Üzgünüz, ancak olay işleyiciye gerçekten gerek yok. İhtiyacınız olan şey, tıklamak için etiketin içindeki başka bir öğedir.

<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

Bu, tıkladığınız şeyle ilgilidir ve etiket değil, içindeki şeydir. Ne yazık ki, çıplak metin JQuery tarafından tanınmıyor gibi görünüyor, ancak vanilya javascript tarafından:

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

Veya jQuery nesnesine bir dizi olarak erişerek

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

9
$ ('selector') [0] .click (), olay işleyiciyi tetiklemenin en az bir vakasını işlemez: tarayıcının bir protokol işleyici bağlantısını tetiklemek için gerçek bir tıklama olarak tanıması. Click olayında tetikleyici çağrılması, ilişkili uygulamanın başlatılmasına neden olmaz. Cevabınıza eklediğiniz için teşekkürler!
Greg Pettit

3
Evet, .click()tam da ihtiyacım olan şey bu!
notacouch

3
$ ('# test2 span'). trigger ('click'); yeni sekmede bir URL açabildiğinden yardımcı oldu, ancak $ ('# test1') [0] .click (); bir pop up instea açıyordu.
Shishir Arora

Arka plan öğesini tıklamaya çalıştığımda: $ ('# titleee a'). Trigger ('click'); -> Çalışmıyor! $ ('# titleee a') [0] .click (); -> Çalışır!
Ağustos, 28:17

1
$ ( '# test1') [0] .click (); bir kurtarıcıdır. Çok teşekkürler
Amit Bisht

18

Bu soru Google'da "bir <a>öğeye tıklamayı tetiklemek" için 1. sırada yer aldığından ve hiçbir yanıt aslında bunu nasıl yaptığınızdan bahsetmediğinden, bunu şu şekilde yapabilirsiniz:

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

Açıklama: jQuery nesnesinde değil,click temeldeki html öğesinde a tetiklersiniz .

Hoş geldiniz googlers :)


2
"jQuery nesnesine değil, temel html öğesine bir tıklamayı tetiklersiniz." - bu benim için tıkladı , teşekkürler!
Frish

5

Girdiğiniz kod ile hiçbir şeyin gerçekleşmesini bekleyemezsiniz. Ben ikinci @mashappslabs: önce bir olay işleyicisi ekleyin:

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

ardından etkinliğinizi tetikleyin:

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

ve mesajı konsolunuzda görmelisiniz.


5
Bu benim için işe yaramaz: seçici "a" ise (bağlantılar için HTML etiketi, sadece açık olmak gerekirse), aradığımda anonim işlev çağrılır trigger, ancak etiketin eylemi gerçekleşmez. Etkinlik ilişkili DOM öğesine yayılmıyor gibi. @GrahamHotchkiss'in yanıtı benim için güvenilir bir şekilde çalışan tek cevap.
Oliver

5

Bağlantıda bir olayı tetiklemeye çalışıyorsanız, sahip olduğunuz kod çalışır.

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

VEYA

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

VEYA

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

3

İlk olarak click olayını ayarlamanız gerekir, ardından tetikleyebilir ve ne olduğunu görebilirsiniz:

//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');

3

Bu, etkinliğin nasıl tetikleneceği demosudur

<!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>

3

Bağlantılar için bu işe yarar:

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

2

Bu, sorunuza tam olarak cevap vermiyor, ancak aynı sonucu daha az baş ağrısıyla elde edecek.

Her zaman yürütmek istediğim tüm mantığı içeren tıklama çağrı yöntemlerim var. Gerçek bir tıklama olmadan eylemi gerçekleştirmek istersem yöntemi doğrudan çağırabilirim.


2

Öğenin yerel .click()yöntemini çağırmalı veyacreateEvent API'yı .

Daha fazla bilgi için lütfen şu adresi ziyaret edin: https://learn.jquery.com/events/triggering-event-handlers/


6
Stack Overflow'a hoş geldiniz! Bu, sorunu çözmek için değerli bir ipucu olsa da, iyi bir cevap da çözümü gösterir. Ne demek istediğinizi göstermek için örnek kod sağlamak üzere lütfen düzenleyin . Alternatif olarak, bunun yerine yorum olarak yazmayı düşünün.
Toby Speight
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.