क्लिक () ईवेंट jquery में दो बार कॉल कर रहा है

Question

मैंने एक लिंक तत्व सेटअप किया है और इसके क्लिक इवेंट को jquery में बुलाया है लेकिन क्लिक इवेंट दो बार कॉल कर रहा है, कृपया jquery के कोड के नीचे देखें।

$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

कृपया सलाह दें।

धन्यवाद।

Comments

समस्या आपकी स्क्रिप्ट में कहीं और से है।

— करीम79

यदि आपको यह पता नहीं चलता कि आपने दो बार कॉल करने के लिए चीजें कहां बनाईं, तो क्लिक (...) से पहले एक unbind ('clik') बनाएं।

— रेगिलो

regilero: वास्तव में, पूरे कोड का आधार बहुत बड़ा है। मुझे कहाँ लगाना चाहिए?

— डोमलो ने

आप यह पता लगा सकते हैं कि उस क्लिक घटना के लिए कौन से कार्य बाध्यकारी हैं: stackoverflow.com/questions/570960/…

— Anh Pham

Answer 1

सुनिश्चित करें और जांचें कि आपने गलती से अपनी स्क्रिप्ट को अपने HTML पृष्ठ में दो बार शामिल नहीं किया है।

Comments

यह मेरे मामले के लिए समस्या थी। कि मेरी क्लिक घटना बुबल हो रही थी। सूचक के लिए धन्यवाद। :) +1

— ताहिर अकरम

मैंने बस इस समाधान को देखा और यह सोचकर हँसा कि "मैं ऐसा करने के लिए बहुत बेवकूफ नहीं हूँ" ... पता चलता है कि मैंने ठीक यही किया था। बहुत बहुत धन्यवाद।

— जेजीपी

धन्यवाद! यह मेरे लिए भी समस्या बन गया। यह एक लार्वा ब्लेड टेम्पलेट में और एक नेस्टेड टेम्पलेट में था जिसे उसी अनुभाग नाम पर @parent कहा जाता था। उफ़। एक बार फिर धन्यवाद!

— फिलिप हैरिंगटन

इस टिप के लिए धन्यवाद। 20 घंटे से अधिक समय तक इसके साथ संघर्ष किया, और इस टिप ने मुझे सही रास्ते पर ले गया। मैं MVC ScriptBundles का उपयोग कर रहा था, लेकिन स्क्रिप्ट फ़ाइलों को सीधे लिंक भी कर रहा था और इससे घटनाओं की नकल हो गई

— मनीष

योग्य ... मैं वहां गया हूं ... मैं दोष तीसरे पक्ष पर डाल रहा था, लेकिन यह मैं था जो दो बार .js फ़ाइल से जुड़ा था।

— जूलियन

Answer 2

क्लिक करने से पहले अनबाइंड करें;

$("#link_button").unbind('click');
$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

Comments

$ कोशिश करें ("# लिंक_बटन")। अनबाइंड (); या यह जाँचने के लिए एक सरल परीक्षा करें कि उस कोड को कितनी बार पढ़ा जाता है, यदि एक से अधिक बार ...

— TheSystem

यह हर बार मक्खी पर त्रुटि को ठीक कर रहा है, न कि वास्तविक समाधान। यह चाल करता है और मेरी मदद की है, लेकिन आपको वास्तविक समस्या का पता लगाना चाहिए और एक स्थायी समाधान करना चाहिए।

— जुआन इग्नासियो

यह मेरे मामले में वास्तव में उपयोगी है, क्योंकि मुझे कई बार अपनी घटनाओं के साथ तरीकों को कॉल करने की आवश्यकता होती है जब कुछ अजाक्स कॉल के बाद यह अतिच्छादित होने लगता है (मुझे नहीं पता कि यह शब्द मौजूद है)। मेरी स्थिति के लिए इसका मतलब एक समाधान है।

— थियागो सी। एस। वेंचुरा

मेरी समस्या को एक स्क्रिप्ट के साथ तय किया जो केवल एक बार शामिल किया गया था। धन्यवाद!

— । रोडा

Answer 3

इसका मतलब है कि आपके कोड में दो बार jquery स्क्रिप्ट शामिल थी। लेकिन इस कोशिश:

$("#btn").unbind("click").click(function(){

//your code

});

Answer 4

मैंने कोशिश की e.stopImmediatePropagation(); यह मेरे लिए काम करने लगता है।

Comments

@ BasheerAL-MOMANI देखें stackoverflow.com/questions/5299740/...

— Fangxing

धन्यवाद, यह काम है ... वैसे पढ़ने के बाद इसे समझने के बाद किसी भी माता-पिता के संचालकों को निष्पादित होने से रोकें

— नंदलाल उशिर

Answer 5

मेरे मामले में मैंने इस मुद्दे को दूर करने के लिए स्क्रिप्ट का उपयोग किया

$('#id').off().on('click',function(){
    //...
});

off()सभी घटनाओं को बांधता है #id। यदि आप केवल clickईवेंट को अनबाइंड करना चाहते हैं , तो उपयोग करें off('click')।

Answer 6

बस (.on) कॉल करने से पहले .off () को कॉल करें।

यह सभी ईवेंट हैंडलर को हटा देगा:

$(element).off().on('click', function() {
// function body
});

केवल पंजीकृत 'क्लिक' ईवेंट हैंडलर्स को हटाने के लिए:

$(element).off('click').on('click', function() {
// function body
});

Answer 7

दो क्लिक की समस्या का एक सामान्य समाधान है

e.stopPropagation()

अपने फ़ंक्शन के अंत में (यह मानते हुए कि आप इसका उपयोग function(e)करते हैं)। यह ईवेंट को बुदबुदाहट से बचाता है जिससे फ़ंक्शन का दूसरा निष्पादन हो सकता है।

Answer 8

मुझे भी यही समस्या थी, लेकिन आप इस कोड को बदलने का प्रयास कर सकते हैं

$("#link_button")
.button()
.click(function () {
   $("#attachmentForm").slideToggle("fast");
});

इसके लिए:

$("#link_button").button();
$("#link_button").unbind("click").click(function () {
   $("#attachmentForm").slideToggle("fast");
});

मेरे लिए, इस कोड ने समस्या को हल कर दिया। लेकिन ध्यान रखें कि गलती से आपकी स्क्रिप्ट दो बार आपके HTML पेज में शामिल न हो। मुझे लगता है कि अगर आप इन दोनों चीजों को सही तरीके से कर रहे हैं, तो आपका कोड सही तरीके से काम करेगा। धन्यवाद

Answer 9

कृपया यह प्रयास करें

$('#ddlSupervisor').live('change', function (e) {
    if (e.handled !== true) { //this makes event to fire only once
    getEmployeesbySupervisor();
    e.handled = true;
   }
});

Comments

मैंने "लाइव" को "ऑन" में बदल दिया और यह मेरे लिए काम करने लगता है। इसलिए ईवेंट केवल उस समय के लिए फायर करता है जब बटन क्लिक किया जाता है।

— विकनेश्वर

इस पर हाजिर है।

— लार्जट्यूना

Answer 10

यह निश्चित रूप से एक बग विशेष रूप से है, जबकि यह फ़ायरफ़ॉक्स है। मैंने खोजा कि उपरोक्त सभी उत्तरों की कोशिश की गई और अंत में SO पर कई विशेषज्ञों द्वारा इसे बग के रूप में प्राप्त किया गया। इसलिए, मैं अंत में इस तरह के परिवर्तनशील की घोषणा करके आया

var called = false;
$("#ColorPalete li").click(function() {
    if(!called)
    {
             called = true;
             setTimeout(function(){ //<-----This can be an ajax request but keep in mind to set called=false when you get response or when the function has successfully executed.
                 alert('I am called');
                 called = false;
             },3000);

    }
});

इस तरह यह पहले जांच करता है बल्कि फ़ंक्शन को पहले बुलाया गया था या नहीं।

Answer 11

e.preventDefault();मेरे फंक्शन की शुरुआत में जोड़ना मेरे लिए काम कर गया।

Answer 12

यह एक पुराना सवाल है, लेकिन अगर आप इवेंट डेलिगेशन का उपयोग कर रहे हैं तो यह मेरे लिए क्या कारण है।

हटाने के बाद .delegate-twoइसे दो बार निष्पादित करना बंद कर दिया। मेरा मानना ​​है कि ऐसा होता है अगर दोनों प्रतिनिधि एक ही पृष्ठ पर मौजूद हों।

$('.delegate-one, .delegate-two').on('click', '.button', function() {
    /* CODE */
});

Answer 13

कोड के इस स्निपेट में कुछ भी बुरा नहीं है। यह आपकी स्क्रिप्ट का एक और हिस्सा है जैसा @Kim ने बताया था

Answer 14

मेरे मामले में, यह क्रोम में ठीक काम कर रहा था और IE .click()दो बार कॉल कर रहा था । यदि यह आपका मुद्दा था, तो मैंने .click()घटना को कॉल करने के बाद, इसे गलत तरीके से वापस कर दिया

   $("#txtChat").keypress(function(event) {
        if (event.which == 13) {
            $('#btnChat').click();
            $('#txtChat').val('');
            return false;
        }
    });

Answer 15

कॉलिंग unbindने मेरी समस्या हल कर दी:

$("#btn").unbind("click").click(function() {
    // your code
});

Answer 16

मुझे यकीन नहीं है कि क्यों लेकिन मुझे यह समस्या थी

$(document).on("click", ".my-element", function (e) { });

जब मैंने इसे बदल दिया

$(".my-element").click(function () { });

समस्या हल हो गई। लेकिन मेरे कोड में निश्चित रूप से कुछ गलत है।

Comments

इसने मेरे लिए लार्वेल में काम किया, न जाने इस मुद्दे का क्या कारण है

— खान फार्मन

Answer 17

मुझे एक चयन के द्वारा कई वस्तुओं से मेल खाते हुए धोखा मिला, इसलिए प्रत्येक पर क्लिक किया गया। :firstमदद की:

$('.someClass[data-foo="'+notAlwaysUniqueID+'"]:first').click();

Answer 18

मैं भी एफएफ पर इस मुद्दे था। मेरा टैग हालांकि एक <a>टैग के लिए बाध्य था । हालांकि <a>टैग कहीं नहीं जा रहा था फिर भी इसने डबल क्लिक किया। मैंने इसके बजाय <a>टैग के लिए टैग को स्वैप किया <span>और डबल क्लिक मुद्दा गायब हो गया।

एक अन्य विकल्प href विशेषता को पूरी तरह से हटा देना है यदि लिंक कहीं नहीं जा रहा है।

Comments

यह वास्तव में सवाल का जवाब नहीं देता है। यदि आपका कोई अलग प्रश्न है, तो आप प्रश्न पूछकर क्लिक करके पूछ सकते हैं । पर्याप्त प्रतिष्ठा होने पर आप इस प्रश्न पर अधिक ध्यान आकर्षित करने के लिए एक इनाम भी जोड़ सकते हैं ।

— सीन पैट्रिक फ्लोयड

@ सीनपेरिकफ्लोयड: वास्तव में, यह एक उत्तर है। भले ही लाल झंडे उठाने के लिए तैयार किया गया हो।

— डेडुप्लिकेटर

Answer 19

मुझे इस मुद्दे का सामना करना पड़ा क्योंकि मेरी $(elem).click(function(){});स्क्रिप्ट को एक div में इनलाइन रखा गया था जिसे सेट किया गया था style="display:none;"।

जब सीएसएस डिस्प्ले को ब्लॉक किया गया था, तो स्क्रिप्ट दूसरी बार इवेंट श्रोता को जोड़ेगी। मैंने स्क्रिप्ट को एक अलग .js फ़ाइल में स्थानांतरित कर दिया और डुप्लिकेट ईवेंट श्रोता अब शुरू नहीं किया गया था।

Answer 20

जब मैं jquery के साथ लोड पेज पर इस पद्धति का उपयोग करता हूं, तो मैं $('#obj').off('click');क्लिक फ़ंक्शन सेट करने से पहले लिखता हूं , इसलिए बुलबुला नहीं होता है। मेरे लिये कार्य करता है।

Answer 21

मेरा सरल उत्तर यह था कि क्लिक बाइंड को एक फंक्शन में बदल दें और कॉल करें कि एलिमेंट के ऑनक्लिक से - एक ट्रीट काम किया! जबकि उपरोक्त में से किसी ने भी नहीं किया

Answer 22

यदि आपका ईवेंट दो या तीन बार या अधिक कॉल कर रहा है, तो यह मदद कर सकता है।

यदि आप घटनाओं को ट्रिगर करने के लिए कुछ इस तरह का उपयोग कर रहे हैं ...

$('.js-someclass').click();

... तो की संख्या पर ध्यान देना .js-someclass आपके पास पृष्ठ पर मौजूद तत्वों , क्योंकि यह सभी तत्वों के लिए क्लिक इवेंट को ट्रिगर करेगा - और सिर्फ एक बार नहीं!

एक साधारण फिक्स तो यह है कि आप केवल एक बार पहले तत्व को चुनकर क्लिक को ट्रिगर करें , उदाहरण के लिए:

$('.js-someclass:first').click();

Answer 23

सुनिश्चित करें कि आपकी स्क्रिप्ट में कहीं और "क्लिक" घटना फिर से उसी तत्व के लिए बाध्य हो रही है, जैसा कि कई अन्य उत्तर / टिप्पणियां सुझाव दे रही हैं।

मुझे एक समान समस्या थी और यह सत्यापित करने के लिए, मैंने बस console.logअपनी स्क्रिप्ट में एक कमांड जोड़ा , जैसे कि निम्नलिखित स्निपेट में:

$("#link_button")
    .button()
    .click(function () {
        console.log("DEBUG: sliding toggle...");
        $("#attachmentForm").slideToggle("fast");
    });

यदि, बटन पर क्लिक करने पर, आपको अपने ब्राउज़र के डेवलपर कंसोल (जैसा मैंने किया) से नीचे की छवि के समान कुछ मिलता है, तो आप यह सुनिश्चित करने के लिए जानते हैं कि click()ईवेंट एक ही बटन से दो बार बंधा हुआ है।

यदि आपको एक त्वरित पैच की आवश्यकता है, तो offविधि का उपयोग करने के अन्य टीकाकारों द्वारा प्रस्तावित समाधान (btw unbindjQuery 3.0 के बाद से हटा दिया गया है) इस घटना को ठीक करने से पहले (फिर से) यह अच्छी तरह से काम करता है, और मैं इसे भी सुझाता हूं:

$("#link_button")
    .button()
    .off("click")
    .click(function () {
        $("#attachmentForm").slideToggle("fast");
    });

दुर्भाग्य से, यह केवल एक अस्थायी पैच है! एक बार जब आपको बॉस को खुश करने की समस्या हल हो जाती है, तो आपको वास्तव में अपने कोड में थोड़ा और खोदना चाहिए और "डुप्लिकेटेड बाइंडिंग" समस्या को ठीक करना चाहिए।

वास्तविक समाधान निश्चित रूप से आपके विशिष्ट उपयोग के मामले पर निर्भर करता है। मेरे मामले में, उदाहरण के लिए, "संदर्भ" की समस्या थी। दस्तावेज़ के एक विशिष्ट भाग पर लागू एक अजाक्स कॉल के परिणामस्वरूप मेरा कार्य शुरू किया गया था: पूरे दस्तावेज़ को फिर से लोड करने से वास्तव में "पृष्ठ" और "तत्व" दोनों संदर्भों को पुनः लोड किया जा रहा है, जिसके परिणामस्वरूप घटना दो बार तत्व के लिए बाध्य हो रही है। ।

इस समस्या का समाधान मेरे jQuery का लाभ उठाने के लिए किया गया था एक समारोह है, जो रूप में ही है पर अपवाद है कि घटना में अपनी पहली मंगलाचरण के बाद स्वत: अनबाउंड है के साथ। यह मेरे उपयोग के मामले के लिए आदर्श था, लेकिन फिर से, यह अन्य उपयोग मामलों के लिए समाधान नहीं हो सकता है।

Answer 24

एक ही समस्या थी। यह मेरे लिए काम किया -

$('selector').once().click(function() {});

आशा है कि यह किसी की मदद करता है।

Comments

मेरे लिए एक त्रुटि फेंकता है ... प्लस यह एक गंदा समाधान है - फ़ंक्शन को एक से अधिक बार चलाया जा रहा है, समाधान इसे कहीं और रखने के लिए है और चीजों को मॉनिटर करने के लिए कंसोल.लॉग () का उपयोग करें।

— tylerl

Answer 25

मेरे मामले में, HTML को इस तरह रखा गया था:

<div class="share">
  <div class="wrapper">
    <div class="share">
    </div>
  </div>
</div>

और मेरा jQuery इस तरह था:

jQuery('.share').toggle();

इसने मुझे उलझन में डाल दिया क्योंकि ऐसा कुछ भी नहीं हुआ। समस्या यह थी कि आंतरिक .shares toggle बाहरी .shares को रद्द कर देगा toggle।

Answer 26

मैंने तत्व प्रकार को बदलकर इस समस्या को हल किया। बटन के बजाय मैं इनपुट देता हूं, और यह समस्या अधिक नहीं होती है।

के उदाहरण:

<button onclick="doSomthing()">click me</button>

से बदलो:

<input onclick="doSomthing()" value="click me">