Href तत्व पर क्लिक इवेंट को कैसे ट्रिगर करें


80

मैं नीचे दिए गए तरीके से jQuery के साथ हाइपरलिंक पर क्लिक इवेंट को ट्रिगर करने की कोशिश कर रहा हूं। हाइपरलिंक के पास कोई आईडी नहीं है लेकिन इसमें cssclass है

 $(document).ready(function () {  $('.cssbuttongo').trigger('click'); }); 

ऊपर फ़ंक्शन काम नहीं कर रहा है। यह हाइपरलिंक है

<a href="hyperlinkurl" class="cssbuttongo">hyperlink anchor</a>

1
एक वर्ग के रूप में डोम में कई तत्वों के लिए लागू किया जा सकता है, यह एक अच्छा विचार नहीं लगता है उन पर एक क्लिक ट्रिगर।
इगोर पार्रा

1
NomikOS आप इसके बारे में बहुत सही हैं, लेकिन मैंने जाँच की कि क्या कोई अन्य तत्व इस css वर्ग का उपयोग करता है :)
मॉन्स्टरमॉरपीजी

जवाबों:


78

मेरे पास यह साबित करने के लिए तथ्यात्मक सबूत नहीं हैं लेकिन मैं पहले ही इस मुद्दे पर भाग गया था। ऐसा लगता है कि ट्रिगर क्लिक () ईवेंट पर<a> टैग करना उसी तरह का व्यवहार नहीं करता जैसा आप कहेंगे, इनपुट बटन के साथ।

मैंने जो वर्कअराउंड किया था, वह विंडो पर लोकेशन को सेट करना था। ऐसा करने से ब्राउज़र को अनुरोध संसाधन लोड करने का कारण बनता है:

$(document).ready(function()
{
      var href = $('.cssbuttongo').attr('href');
      window.location.href = href; //causes the browser to refresh and load the requested url
   });
});

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

मैं एक js फिडेल बनाऊंगा लेकिन jsfiddle ने कोड देने के लिए एक iframe का उपयोग कैसे किया जाता है, इस सवाल के साथ अंतरविरोध किया कि कोई नहीं जाता है।


यह सही जवाब है। धन्यवाद :) मैंने यह भी देखा कि href पर क्लिक करने से काम नहीं चलता है।
मॉन्स्टरमोरपीजी

@MonsterMMorpg ध्यान रखें कि यह ब्राउज़र में यह विश्वास नहीं करता है कि यह प्रत्यक्ष उपयोगकर्ता कार्रवाई है। तो समझदारी से उपयोग करें = D
मैथ्यू कॉक्स

क्या यह var href = $ ('। Cssbuttongo') नहीं होना चाहिए। attr ('href');
लुसी

7
यह इस संभावना की अनदेखी करता है कि लिंक में एक onclickघटना भी है । बस $('.cssbuttongo')[0].click()अपनी संपूर्णता में एक क्लिक को ठीक से अनुकरण करने के लिए करें।
रोमन स्टार्कोव

दरअसल यह पूरी तरह से काम करता है। चूंकि मैं यहां कोड नहीं डाल सकता, इसलिए कृपया इस पोस्ट पर अपना उत्तर पढ़ें।
एलन डोंग

210

मूल डोम विधि सही काम करती है:

$('.cssbuttongo')[0].click();
                  ^
              Important!

यह hrefएक URL, एक टुकड़ा (जैसे #blah) या यहां तक ​​कि एक की परवाह किए बिना काम करता है javascript:

ध्यान दें कि यह clickjQuery विधि के बजाय DOM विधि को कॉल करता है click(जो बहुत अधूरा है और पूरी तरह से अनदेखा करता है href)।


2
@ टिमवी, मेरा कहने का मतलब था कि पहला $('.cssbuttongo').click(); // ignores href!काम करने की गारंटी नहीं होगी। बाद वाला हमेशा काम करेगा, क्योंकि इंडेक्स [0] का उपयोग नियमित रूप से जेएस ऑब्जेक्ट को jQuery ऑब्जेक्ट करेगा जो कि एक ही ब्राउज़र का उपयोग करता है। @Wei लियू
एलन डोंग

1
बहुत बढ़िया! बहुत सीधा और निराशाजनक जवाब।
caiosm1005

11
यह चयनित उत्तर होना चाहिए। पूरी तरह से काम किया!
अमित जी

3
@AdilMalik यह काम करता है क्योंकि jquery केवल एक चीज नहीं है जिसमें एक क्लिक () विधि है। यह कोड गैर- jquery क्लिक () विधि को कॉल करता है, यह एक मूल डोम चीज़ है।
रोमन स्टार्कोव

1
@ टिमवी मैं यहाँ jsfiddle प्रदान करता हूं: jsfiddle.net/NabiKAZ/3gv90od5
नबी

31

Romkyns के महान जवाब के अलावा .. यहाँ कुछ प्रासंगिक प्रलेखन / उदाहरण है।


DOM एलीमेंट्स में एक देशी .click()विधि है

HTMLElement.click()विधि एक तत्व पर एक माउस क्लिक simulates।

जब क्लिक का उपयोग किया जाता है, तो यह तत्व के क्लिक ईवेंट को भी आग देता है जो दस्तावेज़ ट्री (या ईवेंट श्रृंखला) में उच्चतर तत्वों तक बबल जाएगा और उनके क्लिक ईवेंट को भी आग देगा। हालाँकि, किसी क्लिक ईवेंट के बुदबुदाने से <a>नेविगेशन आरंभ करने के लिए कोई तत्व नहीं होगा जैसे कि एक वास्तविक माउस-क्लिक प्राप्त हुआ था। (mdn संदर्भ)

प्रासंगिक W3 प्रलेखन


कुछ उदाहरण ..

  • आप jQuery ऑब्जेक्ट से एक विशिष्ट DOM तत्व का उपयोग कर सकते हैं: (उदाहरण के लिए)

      $('a')[0].click();
    
  • आप .get()किसी jQuery ऑब्जेक्ट से DOM तत्व प्राप्त करने के लिए विधि का उपयोग कर सकते हैं : (उदाहरण के लिए)

      $('a').get(0).click();
    
  • जैसा कि अपेक्षित था, आप DOM तत्व का चयन कर सकते हैं और .click()विधि को कॉल कर सकते हैं । (उदाहरण)

      document.querySelector('a').click();
    

यह इंगित करने योग्य है कि jQuery को मूल घटना को ट्रिगर करने की आवश्यकता नहीं है .click()


4

जावास्क्रिप्ट के माध्यम से एक क्लिक को ट्रिगर करने से हाइपरलिंक नहीं खुलेगा। यह ब्राउज़र में बनाया गया एक सुरक्षा उपाय है।

हालाँकि कुछ वर्कअराउंड के लिए यह प्रश्न देखें ।


1
मुझे ऐसा नहीं लगता .. BECAUSE: मुझे लगता है कि इस तरह काम कर रहा है .. यहाँ jsfiddle का
कोडी

3
@CodyDmd अभी भी एक उपयोगकर्ता-ट्रिगर क्लिक इवेंट हो रहा है। ओपी के मूल प्रश्न के समान नहीं है।
ब्लेज़मॉन्गर

@ कोडिद्म ऐसा लगता है कि [0]आपकी बेला में महत्वपूर्ण है
लियू

3
क्या भेद्यता है जो रक्षा करती है, बिल्कुल?
रोमन स्टार्कोव

3
वैसे मुझे नहीं पता कि आपका क्या मतलब है, ब्लेज़मॉन्गर, क्योंकि फ़ायरफ़ॉक्स में डाउनलोड या एसईओ क्लिक धोखाधड़ी के खिलाफ ऐसी कोई सुरक्षा नहीं है, न ही क्रोम, और न ही IE11। दूसरे शब्दों में, आपके उत्तर के पहले और दूसरे दोनों वाक्य झूठे हैं
रोमन स्टार्कोव

3

बस आप लोगों को बताना चाहते हैं, स्वीकृत जवाब हमेशा काम नहीं करता है।

यहाँ एक उदाहरण है यह विफल हो जाएगा।

अगर <href='/list'>

href = $('css_selector').attr('href')
"/list"
href = document.querySelector('css_selector').href
"http://localhost/list"

या आप इसे jQuery से प्राप्त href को जोड़ सकते हैं

href = document.URL +$('css_selector').attr('href');

या jQuery रास्ता

href = $('css_selector').prop('href')

अंत में, ब्राउज़र वर्तमान पृष्ठ के url को बदलने के लिए इसे लागू करें

window.location.href = href

या इसका उपयोग करके पॉप आउट करें window.open(url)

यहाँ JSFiddle में एक उदाहरण है।


तो आप कह रहे हैं कि यदि आप इसे बदलते हैं तो यह काम नहीं करता है $('css_selector')[0].click()? यह इस JsFiddle में काम करता है ...
रोमन

रिकॉर्ड के लिए, यह मेरे लिए नहीं था जो अपमानजनक था; मुझे लगता है कि यहां कुछ हो सकता है और मुझे अभी तक यकीन नहीं है।
रोमन स्टार्कोव

@romkyns, निश्चित रूप से, यह आपके द्वारा jQuery तत्वों से निकालने के बाद काम करने जा रहा है [0] (यह शुद्ध JS बन जाता है), मेरा कहने का मतलब $('.cssbuttongo').click();यह नहीं होगा कि यह केवल href का मान देता है, बजाय URL के ब्राउज़र का उपयोग करता है। भ्रामक टिप्पणियों के बारे में क्षमा करें।
एलन डोंग

2
@LinDong: यदि आप जानते हैं कि [0].click()काम करता है, तो आपके उत्तर में इसका उल्लेख क्यों नहीं है?
तिमवी

location.hrefसापेक्ष रास्तों को स्वीकार करता है, इसलिए उपयोग करने /listसे स्वचालित रूप से वर्तमान डोमेन तैयार हो जाएगा। तो यह काम करता है।
टिम

-1

मैं एक समान मुद्दे का सामना कर रहा था कि लिंक के बजाय बटन पर क्लिक कैसे किया जाए। यह तरीकों में सफल नहीं हुआ ।trigger ('क्लिक') या [0] .click (), और मुझे पता नहीं क्यों। अंत में, निम्नलिखित मेरे लिए काम कर रहा था:

$('#elementid').mousedown();
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.