jQuery एक क्लिक के बाद अन्य घटनाओं को रोकता है

Question

मैं लिंक और वस्तुओं पर कई क्लिक रोकने की कोशिश कर रहा हूं, जो समस्याएं पैदा कर रहा है।

मैं बटन (jQuery UI) और छवि लिंक (<a><img /></a>) पर क्लिक ईवेंट को बाध्य करने के लिए jQuery का उपयोग कर रहा हूं।

क्या ऐसा करने का कोई तरीका है-एक-दूसरे के लिए एक क्लिक होने के बाद फायरिंग से अन्य घटनाओं को रोकने के लिए?

या क्या मुझे _isProcessing नामक वैश्विक चर को बनाए रखना है और इसे प्रत्येक ईवेंट हैंडलर के लिए सही पर सेट करना है?

धन्यवाद

संपादित करें: (स्पष्टीकरण) अपने जवाब के लिए धन्यवाद, मेरी समस्या घटना के उत्साह से भरा हुआ रोकने नहीं है, लेकिन कई समवर्ती क्लिक से बचने।

Answer 1

कोड चलाने से समवर्ती क्लिक को रोकने के कई तरीके हैं।

तत्व पर unbind('click') का एक तरीका है, तो .bind() फिर से तैयार होने पर इसे फिर से करें।

मैं कुछ प्रकार के ध्वज का उपयोग करना चाहता हूं। यह एक चर हो सकता है, लेकिन मैं तत्व को कक्षा को असाइन करना चाहूंगा, जैसे .processing, और इसे पूरा होने पर हटा दें। इसलिए आपके पास उस वर्ग के अस्तित्व के लिए हैंडलर चेक होगा जो कोड को निर्धारित करने के लिए निर्धारित करना चाहिए।

$('someElement').click(function() { 
    var $th = $(this); 
    if($th.hasClass('processing')) 
      return; 
    $th.addClass('processing'); 
    // normal code to run 
    // then when done remove the class 
    $th.removeClass('processing'); 
}); 

एक अन्य विकल्प तत्वों .data() का उपयोग $(this).data('processing', true); जैसे एक समान ध्वज सेट करने के लिए, तो गलत पर सेट हो जाने के लिए है।

Answer 2

क्या आपने रोकथाम की जांच की है?

$("a").click(function(e) { 
    e.preventDefault(); 
} 

आप भी stopImmediatePropagation() या stopPropagation()

---

की कोशिश कर सकते तुम भी one() घटना पर गौर कर सकता है।

तत्वों के लिए किसी ईवेंट में हैंडलर संलग्न करें। हैंडलर प्रति तत्व एक बार पर निष्पादित किया जाता है।

Answer 3

आपके घटना संचालकों से

वापसी false, या हर हैंडलर में ev.stopPropagation() कहते हैं।

Answer 4

event.preventDefault, event.stopPropagation है और पहले से ही बताया गया है कि झूठी वापसी।

$("a").click(function(e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    return false; 
} 

Answer 5

आप विकल्पों में से एक जोड़े को मिल गया है:

1. यदि आपका बटन/लिंक पृष्ठ पुनः लोड होगा, तो आप बस क्लिक ईवेंट हैंडलर निकल कर सकते हैं:

   $('input:submit').click(fumction() { 
       $(this).unbind('click'); 
       // Handle event here 
   }) 
   

2. आप बटन अक्षम कर सकते हैं, और एक बार पूरा होने के बाद उन्हें पुनः सक्षम कर सकते हैं (मुझे लगता है कि यह <input type="image"> के साथ भी काम करना चाहिए):

   $('input:submit').click(function() { 
       $(this).attr('disabled', 'disabled'); 
       // It also helps to let the user know what's going on: 
       $(this).val('Processing...'); 
       // Handle event here 
       $(this).removeAttr('disabled'); 
   }) 
   

   मुझे नहीं लगता कि यह लिंक पर काम करता है।

Answer 6

एक और तरीका है संकेतन के लिए event.stopPropagation() और event.isPropagationStopped() उपयोग करने के लिए होगा:

उदाहरण:

$(button).click(function(e){ 
    if(e.isPropagationStopped()) 
     return; // propagation was stopped, so stop further execution 

    // if you got this far - this event handler was called first 
    // custom logic goes here 

    // stop event propagation to signal other handlers 
    e.stopPropagation(); 

    // if you need, call e.preventDefault() to prevent default behaviour 
}); 

दोहराएँ अन्य घटना संचालकों के लिए एक ही तर्क।