चेकबॉक्स चेक पेरेंट तत्व

Question

को जोड़ने वर्ग मैं चेक बॉक्स इस तरह लग रही के साथ एक मेज है, तो:

<td class="table-col" > 
    <div class="group-one" > 
    <input type="checkbox" /> 
    </div> 
</td> 

मुझे क्या करना चाहते हैं जब चेकबॉक्स एक "चयनित" वर्ग लागू करने के लिए जाँच की है करने के लिए "टेबल col "।

if ($('.table-col').find(':checked')) { 
    $(this).parent().parent().addClass('selected'); 
} 

मैंने ऊपर की तरह एक समान समाधान के साथ कई पोस्ट देखी लेकिन यह मेरे लिए काम नहीं लग रहा है। मुझे यकीन नहीं है कि क्यों यह HTMLDocument पर इंगित कर रहा है तत्व नहीं।

(संपादित करें) इस पृष्ठ पर चेकबॉक्स चिह्नित किए जाएंगे, जिन्हें मैं "चयनित" लागू करना चाहता हूं। टिप्पणियों पर @cimmanon घटना प्रबंधन का उल्लेख किया। मुझे इसे देखना होगा। जवाब के लिए भी धन्यवाद!

(संपादित)

<td class="table-col"> 
<div class="group-one"> 
    <input type="checkbox" checked="checked"/> 
</div> 
</td> 

तो pageloads के बाद वहाँ चिह्नित बक्से होगा (मुझे लगता है कि वे हमेशा शामिल होंगे जाँच = "जाँच" - नहीं यकीन है कि) चेक बॉक्स। ये वे हैं जिन्हें एक नई शैली की आवश्यकता है। उन्हें क्लिक करने और शैली को लागू करने की बातचीत की कोई ज़रूरत नहीं है लेकिन फिर भी बहुत अच्छा है।

Answer 1

इस प्रयास करें ...

$(":checkbox").on('click', function(){ 
    $(this).parent().toggleClass("checked"); 
}); 

Example

नमस्ते।

Answer 2

अपने चेकबॉक्स को कोई नाम दें ताकि jQuery इसे करने के लिए हुक कर सकते हैं:

$('input[name=foo]').is(':checked') 

Answer 3

आप .change() उपयोग कर सकते हैं change घटना के लिए बाध्य करने के लिए; फिर, दादाजी तत्व से selected कक्षा नाम जोड़ने या निकालने के लिए .closest() और .toggleClass() का उपयोग करें। (ताकि आप इसे अपने कोड के अनुसार दादा-दादी है तक जा सकता है)

$("input:checkbox").change(function(){ 
    $(this).closest(".table-col").toggleClass('selected', this.checked); 
}); 

See it here.

Answer 4

$ (इस) केवल अपने चेकबॉक्स का उल्लेख होगा जब आप इसे सौंपा होने द्वारा लाया एक ईवेंट हैंडलर में हैं चेकबॉक्स तत्व के रूप में @cimmanon पर संकेत दिया।

तो यदि आपने अपने चेकबॉक्स में .change() हैंडलर असाइन किया है, तो $ (यह) आपके चेकबॉक्स का संदर्भ देगा। आप वास्तव में एक पंक्ति में ऐसा कर सकते हैं क्योंकि आप शायद चालू या बंद "चयनित" वर्ग टॉगल करने के लिए करना चाहते हैं:

$(":checkbox").change(function() { 
    $(this).parent().parent().toggleClass('selected'); 
     }); 

अन्यथा $ (this) नियंत्रण है कि उदाहरण के लिए घटना उठाया को संदर्भित करता है अगर आप को क्रियान्वित कर रहे हैं बटन के जवाब में यह कोड हैंडलर क्लिक करें, $ (यह) बटन को संदर्भित करेगा।