मैं अपने jQuery चेक/अनचेक फ़ंक्शन को ओवरराइड करने से डिफ़ॉल्ट चेकबॉक्स ईवेंट को कैसे रोकूं?

Question

मेरे पास एक साधारण jQuery फ़ंक्शन के साथ तालिका के अंदर चेकबॉक्स की एक सूची है जो उपयोगकर्ता को चेकबॉक्स को चेक/अनचेक करने के लिए तालिका पंक्ति में कहीं भी क्लिक करने की अनुमति देती है। यह बहुत अच्छा काम करता है, सिवाय इसके कि जब उपयोगकर्ता वास्तव में चेकबॉक्स पर क्लिक करता है। यह तब काम नहीं करता है। कोई विचार? यहाँ मेरी कोड है:

HTML:

<tr onClick="checkBox()">...</tr> 

jQuery:

function checkBox() { 

var ischecked = $('input#myContacts').attr("checked"); 

if(ischecked) 
{ 
    $('input#myContacts').attr("checked", false); 
} 
else 
{ 
    $('input#myContacts').attr("checked", true); 
} 

return false; 
} 

Answer 1

के क्लिक ईवेंट से बचने के लिए आप event.stopPropagation का उपयोग कर सकते हैं ताकि tr के क्लिक ईवेंट पर प्रचार हो सके। साथ ही, मुझे विश्वास नहीं है कि आप अभी तक jQuery और DOM को मिश्रित कर रहे हैं, जब आपको jQuery ईवेंट का उपयोग करना चाहिए।

$(document).ready(function(){ 
    $("input#myContacts").click(function(e){ 
    e.stopPropagation(); 
    }); 
}); 

Answer 2

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

Answer 3

<tr class="checkBox">...</tr> 


    $(document).ready(function() { 
     $('tr.checkBox').live('click', function (e) { 
      if (e.target.type !== 'checkbox') { 
       $('input#myContacts').attr("checked", function() { 
        return !$(this).prop('checked'); 
       }); 

       //Or 

       $(this).find('input#myContacts').attr("checked", function() { 
        return !$(this).prop('checked'); 
       }); 
      } 
     }); 
    }); 

Answer 4

समाधान 1: http://jsfiddle.net/qmdGK/3/ (दो तालिका कोशिकाओं का उपयोग, लेकिन केवल पाठ को सेल क्लिक बंधन)

समाधान 2: http://jsfiddle.net/qmdGK/4/ (stopPropagation() का उपयोग कर चेकबॉक्स क्लिक करें घटना पर)

दोनों घटना को उस तत्व को बांधने के लिए jQuery का उपयोग कर रहे हैं जिसे प्राथमिकता दी जाती है।