JQuery का उपयोग करके लिंक पर एक क्लिक को कैसे ट्रिगर किया जाए


238

मेरे पास एक लिंक है:

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

और मैं इसका उपयोग करके इसे ट्रिगर करने की कोशिश कर रहा हूं:

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

लेकिन यह काम नहीं करता है।

मैंने भी कोशिश की है: $('#titleee a').trigger('click');

संपादित करें :

मुझे वास्तव में यहां जो भी मिलता है उसे ट्रिगर करने की आवश्यकता है <a href="#inline" rel="prettyPhoto">


7
location.href($('#titleee').find('a').attr("href"));?
सिल्वेन

3
या यहां तक ​​कि $ ('ul.gallery')। ('li> a')। ट्रिगर ('क्लिक');
कार्नेकोड

114
दोस्तों। असली जवाब इतना आसान है। $('#titleee a')[0].click();। दूसरे शब्दों में, डोम क्लिक विधि का उपयोग करें, न कि jQuery का। वोट दें ग्राहम हॉचकिस !
रोमन स्टार्कोव

5
@romkyns अपने नए टैब के बजाय एक पॉप अप खोलने के रूप में इसका कोई अधिकार नहीं है। लेकिन इस 'ए' टैग के अंदर एक डमी अवधि पर क्लिक करने से उद्देश्य पूरा होता है
शिशिर अरोरा

1
यदि आप लंगर पर एक घटना को ट्रिगर करने की कोशिश कर रहे हैं, तो आपके पास कोड काम करेगा। $('ul#titleee li a[href="#inline"]').click();
आनंद पाल

जवाबों:


307

यदि आप एंकर पर एक घटना को ट्रिगर करने की कोशिश कर रहे हैं, तो आपके पास जो कोड होगा वह काम करेगा I मैंने आपके उदाहरण को jsfiddle में एक जोड़ा इवेंटहैंडलर के साथ फिर से बनाया है ताकि आप देख सकें कि यह काम करता है:

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

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

क्या आप उपयोगकर्ता को एंकर पर क्लिक करके वेबपेज पर एक निश्चित बिंदु पर नेविगेट करने का कारण बनने की कोशिश कर रहे हैं, या आप उससे जुड़ी घटनाओं को ट्रिगर करने की कोशिश कर रहे हैं? हो सकता है कि आपने वास्तव में क्लिक ईवेंट को सफलतापूर्वक ईवेंट में न बांधा हो?

यह भी:

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

इस के बराबर है:

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

कॉल खोजने की आवश्यकता नहीं है। :)


16
@Kit .find () आप जो प्रस्ताव दे रहे हैं, उससे कहीं ज्यादा तेज चयनकर्ता है, यदि आप असहमत हैं तो एक बेंचमार्क करें लेकिन आपका प्रस्ताव इसे धीमा कर देता है। सकारात्मक रूप से :-)
Ady Ngom

14
@mashappslabs - यह ठीक है। यदि आप समय से पहले और सूक्ष्म अनुकूलन करने की आवश्यकता महसूस करते हैं, तो यह आपके लिए खुश है, चाहे वह कितना भी सच हो। :)
किट सुंडे

5
@ किट ... इसलिए जब आप एक बयान दे रहे हैं जैसे "कॉल करने की कोई आवश्यकता नहीं है", तो यह समय से पहले अनुकूलन के दायरे में नहीं आता है ?? मुझे लगता है कि यह होता है, लेकिन यह पहले की तुलना में धीमी गति से घटित होता है। मैं तर्क के लिए जवाब नहीं दे रहा हूं, लेकिन हम जो प्यार कर रहे हैं उस पर बेहतर प्रयास करने के लिए एक ठोस प्रयास के लिए। मुझे आशा है कि यह सही निकलता है :-)
Ady Ngom

5
@mashappslabs - पहली बार jsperf.com को देखकर मैंने सोचा था कि मैं वापस आऊंगा और कहूंगा कि आप सही हैं, सामान्य स्थिति में आपका तरीका तेज़ है। केवल ओपेरा धीमा है। jsperf.com/jquery-selector-perf-right-to-left/32
किट

9
अजीब तरह, ऊपर मेरे लिए काम नहीं करता है, लेकिन @GrahamHotchkiss जवाब नहीं करता है।
ओलिवर

210

क्षमा करें, लेकिन ईवेंट हैंडलर की वास्तव में आवश्यकता नहीं है। आपको जिस चीज की आवश्यकता है, उस पर क्लिक करने के लिए टैग के भीतर एक और तत्व है।

<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

यह सब कुछ है कि आप क्या क्लिक कर रहे हैं और यह टैग नहीं बल्कि इसके भीतर की चीज है। दुर्भाग्य से, नंगे पाठ को JQuery द्वारा मान्यता प्राप्त नहीं लगता है, लेकिन यह वेनिला जावास्क्रिप्ट द्वारा है:

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

या एक सरणी के रूप में jQuery वस्तु तक पहुँचने के द्वारा

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

9
$ ('चयनकर्ता') [0] .click () वास्तव में कम से कम एक मामले को संभालेगा जो कि ईवेंट हैंडलर को ट्रिगर करेगा: नहीं होगा: ब्राउजर इसे प्रोटोकॉल हैंडलर लिंक को ट्रिगर करने के लिए वास्तविक क्लिक के रूप में पहचानता है। क्लिक इवेंट पर ट्रिगर को कॉल करने से संबद्ध एप्लिकेशन लॉन्च नहीं होगा। आपके उत्तर में इसे शामिल करने के लिए धन्यवाद!
ग्रेग पेटिट

3
हां, .click()ठीक वही है जो मुझे चाहिए था!
notacouch

3
$ ('# टेस्ट 2 स्पैन')। ट्रिगर ('क्लिक'); मदद के रूप में यह नए टैब में एक यूआरएल खोल सकते हैं लेकिन $ ('# test1') [0] .click (); इंस्टा पर पॉप अप खोल रहा था।
शिशिर अरोड़ा

जब मैं पृष्ठभूमि तत्व पर क्लिक करने की कोशिश करता हूं: $ ('# शीर्षक a')। ट्रिगर ('क्लिक'); -> काम नहीं करता है! $ ('# शीर्षक a') [0] .click (); -> काम करता है!
18 उद्घाटन

1
$ ( '# test1') [0] .click (); एक रक्षक है। बहुत बहुत धन्यवाद
अमित बिष्ट

18

चूंकि यह प्रश्न Google में "एक <a>तत्व पर एक क्लिक को ट्रिगर करने" के लिए # 1 स्थान पर है और कोई जवाब वास्तव में उल्लेख नहीं करता है कि आप ऐसा कैसे करते हैं, यह है कि आप इसे कैसे करते हैं:

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

स्पष्टीकरण: आप clickअंतर्निहित html- तत्व पर ट्रिगर करते हैं , न कि jQuery- ऑब्जेक्ट पर

आपका स्वागत है googlers :)


2
"आप अंतर्निहित html- तत्व पर एक क्लिक को ट्रिगर करते हैं, न कि jQuery- ऑब्जेक्ट पर।" - यह मेरे लिए क्लिक किया , धन्यवाद!
फ्राई

5

आपके द्वारा प्रदान किए गए कोड के साथ, आप कुछ भी होने की उम्मीद नहीं कर सकते। मैं दूसरा @mashappslabs: पहले एक घटना हैंडलर जोड़ें:

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

फिर अपने ईवेंट को ट्रिगर करें:

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

और आपको अपने कंसोल में संदेश देखना चाहिए।


5
यह मेरे लिए काम नहीं करता है: यदि चयनकर्ता "ए" है (लिंक के लिए HTML टैग, बस स्पष्ट होने के लिए), अनाम फ़ंक्शन को कॉल किया जाता है जब मैं कॉल करता हूं trigger, लेकिन टैग की कार्रवाई नहीं होती है। यह ऐसा है जैसे कि घटना संबंधित DOM तत्व का प्रचार नहीं करती है। @GrahamHotchkiss द्वारा जवाब केवल एक ही है कि मेरे लिए मज़बूती से काम करता है।
ओलिवर

5

यदि आप लंगर पर एक घटना को ट्रिगर करने की कोशिश कर रहे हैं, तो आपके पास कोड काम करेगा।

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

या

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

या

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

3

वैसे आपको पहले क्लिक इवेंट सेटअप करना होगा फिर आप इसे ट्रिगर कर सकते हैं और देख सकते हैं कि क्या होता है:

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

यह डेमो है कि कैसे घटना को ट्रिगर किया जाए

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

लिंक के लिए यह काम करना चाहिए:

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

2

यह आपके प्रश्न का सटीक उत्तर नहीं देता है, लेकिन आपको कम सिरदर्द के साथ ऐसा ही परिणाम मिलेगा।

मेरे पास हमेशा मेरे क्लिक ईवेंट कॉल के तरीके होते हैं जिनमें वे सभी तर्क होते हैं जिन्हें मैं निष्पादित करना चाहता हूं। अगर मैं वास्तविक क्लिक के बिना कार्रवाई करना चाहता हूं तो मैं सीधे विधि को कॉल कर सकता हूं।


2

आपको तत्व की मूल .click()विधि को कॉल करना चाहिए या createEventएपीआई का उपयोग करना चाहिए ।

अधिक जानकारी के लिए, कृपया देखें: https://learn.jquery.com/events/triggering-event-handlers/


6
ढेर अतिप्रवाह में आपका स्वागत है! हालांकि यह समस्या को हल करने के लिए एक मूल्यवान संकेत हो सकता है, एक अच्छा जवाब भी समाधान को प्रदर्शित करता है। कृपया संपादित तुम क्या मतलब है दिखाने के लिए उदाहरण कोड प्रदान करने के लिए। वैकल्पिक रूप से, इसके बजाय टिप्पणी के रूप में लिखने पर विचार करें।
टोबी स्पाइट
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.