JQuery.trigger ('क्लिक') कैसे प्राप्त करें; एक माउस क्लिक आरंभ करने के लिए


145

मुझे यह समझने में मुश्किल समय हो रहा है कि JQuery का उपयोग करके माउस क्लिक का अनुकरण कैसे करें। क्या कोई मुझे सूचित कर सकता है कि मैं क्या गलत कर रहा हूं।

HTML:

<a id="bar" href="http://stackoverflow.com" target="_blank">Don't click me!</a>
<span id="foo">Click me!</span>

jQuery:

jQuery('#foo').on('click', function(){
    jQuery('#bar').trigger('click');
});

डेमो: FIDDLE

जब मैं बटन पर क्लिक करता हूं #foo तो मैं #bar पर एक क्लिक का अनुकरण करना चाहता हूं लेकिन जब मैं यह प्रयास करता हूं, तो कुछ भी नहीं होता है। मैंने भी कोशिश की jQuery(document).ready(function(){...})लेकिन सफलता के बिना।


2
jQuery triggerकेवल तभी काम करता है जब कोई 'jQuery क्लिक' ईवेंट जोड़ा जाता है। अन्यथा आप इस तरह से कुछ भी नहीं कर पाएंगे;
रेजा मामून

3
यह ब्राउज़र में बनाया गया एक सुरक्षा उपाय है। @ Blazemonger का उत्तर देखें: stackoverflow.com/questions/7999806/…
sanchez

1
@ san.chez दिलचस्प, जानकारी के लिए धन्यवाद, इस सुरक्षा उपाय के बारे में पहले नहीं पता था!
लिकमीकोड

जवाबों:


277

आपको jQuery विधि का उपयोग करने के बजाय jQuery('#bar')[0].click(); वास्तविक DOM तत्व (jQuery ऑब्जेक्ट नहीं) पर माउस क्लिक अनुकरण करने के लिए उपयोग करने की आवश्यकता है .trigger()

नोट: DOM लेवल 2 सफारी में कुछ तत्वों.click() पर काम नहीं करता है । आपको वर्कअराउंड का उपयोग करने की आवश्यकता होगी।

http://api.jquery.com/click/


18
आपने मेरा दिन $ बचाया ('# asd') [0] .click ();
वजा १२

JQuery ACF फ़ील्ड: $ ('। Next') पर अगले टैब पर क्लिक करने के लिए इसका उपयोग किया। क्लिक करें (फ़ंक्शन () {$ ('# प्राथमिक li.active') अगला। ') [0] .click ();});
Tisch

1
धन्यवाद। यह डेस्कटॉप में काम करता है। लेकिन मोबाइल (Android क्रोम) पर यह नहीं है। कोई सुझाव?
kk-dev11

किसी कारण से यह वर्तमान URL में हैश को नष्ट कर देता है।
लुइस

1
यदि <h टैग पर कोई भी एक टैग '#' है, तो वह ऐसा करेगा। <सामान्य रूप से किसी भिन्न URL पर रीडायरेक्ट होता है। अपने क्लिक हैंडलर रिटर्न से पहले आपको ev.preventDefault () और ev.stopPropagation () के साथ इसे रोकना होगा। या, <a a के अलावा कुछ अन्य टैग का उपयोग करें; आप क्लिक करने वाले को दिखाई देने वाली किसी भी चीज़ से संलग्न कर सकते हैं।
ओसामाबिनलोगिन

43

आपको ऐसा करने से पहले बस एक छोटा सा टाइमआउट इवेंट डालना .click() होगा:

setTimeout(function(){ $('#btn').click()}, 100);

सही काम करता है अगर आप पृष्ठ लोड होने पर एक क्लिक अनुकरण करने की कोशिश कर रहे हैं।
गेब्रियल डिज़ुल

33

यह JQuery का व्यवहार है। मुझे यकीन नहीं है कि यह इस तरह से क्यों काम करता है, यह केवल लिंक पर ऑनक्लिक फ़ंक्शन चलाता है।

प्रयत्न:

jQuery(document).ready(function() {
    jQuery('#foo').on('click', function() {
        jQuery('#bar')[0].click();
    });
});

स्पष्टीकरण के लिए धन्यवाद। JQuery का बहुत परेशान करने वाला व्यवहार, लेकिन आपका कोड काम करता है।
लिकमीकोड

परेशान बिल्कुल नहीं। trigger()क्लिक इवेंट जावास्क्रिप्ट भाग को निष्पादित करने का इरादा है । यह function var() {}कई बार फिर से उपयोग किए गए एक thats बनाने के समान है ।

21

मेरा डेमो देखें: http://jsfiddle.net/8AVau/1/

jQuery(document).ready(function(){
    jQuery('#foo').on('click', function(){
         jQuery('#bar').simulateClick('click');
    });
});

jQuery.fn.simulateClick = function() {
    return this.each(function() {
        if('createEvent' in document) {
            var doc = this.ownerDocument,
                evt = doc.createEvent('MouseEvents');
            evt.initMouseEvent('click', true, true, doc.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
            this.dispatchEvent(evt);
        } else {
            this.click(); // IE Boss!
        }
    });
}

मैं लपेट हैं this.click();एक मेंelse if(this.click)
एलेक्स डब्ल्यू

15

योग्य हो सकता है:

घटना को कॉल करने के बाद ट्रिगर को कॉल करने वाला कोड जाना चाहिए ।

उदाहरण के लिए, मेरे पास कुछ कोड हैं जिन्हें मैं निष्पादित करना चाहता हूं जब #expense_ticket मान बदल दिया जाता है, और जब पृष्ठ लोड होता है

$(function() { 

  $("#expense_tickets").change(function() {
    // code that I want to be executed when #expense_tickets value is changed, and also, when page is reload
  });

  // now we trigger the change event
  $("#expense_tickets").trigger("change");

})

4
आह्ह्ह वो भी मेरी समस्या थी! क्यों trigger()काम नहीं कर रहा था के रूप में चकित था। पता चलता है कि मैं ट्रिगर कोड सेट कर रहा था जिस फ़ंक्शन को बुला रहा था - इसलिए हुक वास्तव में नहीं था। रवींद्र!
एंड्रयू न्यूबी

5

jQuery का .trigger('click');केवल इस ईवेंट पर ट्रिगर करने के लिए कोई ईवेंट होगा, यह डिफ़ॉल्ट ब्राउज़र कार्रवाई को भी ट्रिगर नहीं करेगा।

आप निम्न जावास्क्रिप्ट के साथ समान कार्यक्षमता का अनुकरण कर सकते हैं:

jQuery('#foo').on('click', function(){
    var bar = jQuery('#bar');
    var href = bar.attr('href');
    if(bar.attr("target") === "_blank")
    {
        window.open(href);
    }else{
        window.location = href;
    }
});


0

मैंने शीर्ष दो उत्तरों की कोशिश की है, यह मेरे लिए तब तक काम नहीं आया जब तक मैंने अपने फ़ाइल इनपुट तत्वों से "प्रदर्शन: कोई नहीं" हटा दिया। फिर मैं वापस .trigger () में लौट आया। इसने खिड़कियों के लिए सफारी का भी काम किया।

इसलिए निष्कर्ष, प्रदर्शन का उपयोग न करें: कोई नहीं; अपने फ़ाइल इनपुट को छिपाने के लिए , आप अपारदर्शिता का उपयोग कर सकते हैं: 0 के बजाय।


0

तकनीकी रूप से इसका उत्तर नहीं है, लेकिन jQuery ACF फ़ील्ड पर टैब के लिए अगले और प्रचलित बटन बनाने के लिए स्वीकृत उत्तर ( https://stackoverflow.com/a/20928975/82028 ) का एक अच्छा उपयोग है :

$('.next').click(function () {
    $('#primary li.active').next().find('.acf-tab-button')[0].click();
});

$('.prev').click(function () {
    $('#primary li.active').prev().find('.acf-tab-button')[0].click();
});


-3

आप जावास्क्रिप्ट के साथ एक क्लिक घटना का अनुकरण नहीं कर सकते। jQuery .trigger()फ़ंक्शन केवल तत्व पर "क्लिक" नामक एक घटना को आग लगाता है, जिसे आप .on()jQuery विधि से कैप्चर कर सकते हैं ।


9
"आप जावास्क्रिप्ट के साथ एक क्लिक घटना का अनुकरण नहीं कर सकते हैं" - हाँ आप कर सकते हैं
nnnnnn

गलत ... आप एक क्लिक ईवेंट को जावास्क्रिप्ट / jquery के साथ अनुकरण कर सकते हैं और आप बिना क्लिक किए ट्रिगर क्लिक इवेंट पर कब्जा कर सकते हैं।
13
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.