2011-10-31 6 views
267

मेरे पास एक फ़ंक्शन है जो मैं केवल तभी ट्रिगर करना चाहता हूं जब एक ही टी में चेकबॉक्स चेक किया जाए। कृपया मुझे बताएं कि मैं क्या गलत कर रहा हूं, सामान्य तरीके काम नहीं कर रहे हैं। धन्यवादjQuery यदि चेकबॉक्स चेक किया गया है

जे एस

$(".add_menu_item_table").live('click', function() { 
var value_td = $(this).parents('tr').find('td.td_name').text(); 
if ($('input.checkbox_check').attr(':checked')); { 
    var newDiv = $('<div class="div_menu_button"></div>'); 
    var showDiv = $('<div id="show'+ "0" + numShow++ +'" class="menu_button_info hidden"></div>'); 
    var toggleTrigger = $('<a id="toggleshow'+ "0" + numToggle++ +'" data-target="#show'+ "0" + numTarget++ +'" class="toggle_trigger actions">&nbsp;</a><div style="padding:5px"></div>'); 
    var menuForm = $('<form id="menu_edit_form'+ "0" + numForm++ +'" class="menu_creation_form"></form>'); 
    $('#created_buttons_list').append(
     newDiv.text(value_td)); 
     newDiv.wrap("<li></li>"); 
     newDiv.append(toggleTrigger); 
     newDiv.append(showDiv); 
     showDiv.append(menuForm); 
     menuForm.html('<label for="navigation_label">Navigation Label</label><input id="navigation_label'+ "0" + numLabelone++ +'" type="text" placeholder="Navigation Label" name="navigation_label"><label for="attribute">Attribute</label><input id="attribute'+ "0" + numLabeltwo++ +'" type="text" type="text" placeholder="Attribute" name="attribute"><label for="url">URL</label><input id="url'+ "0" + numLabelthree++ +'" type="text" type="text" placeholder="URL" name="url"><input type="button" value="Remove" class="button_link remove_button"> <input type="reset" value="Cancel" class="button_link">'); 
} 
}); 

var numToggle = 0; 
var numShow = 0; 
var numTarget = 0; 
var numForm = 0; 
var numLabelone = 0; 
var numLabeltwo = 0; 
var numLabelthree = 0; 

एचटीएमएल

<table width="316px" border="0" cellspacing="0" cellpadding="0" id="table-data"> 
        <tbody> 
        <tr> 
        <td width="20px"><input type="checkbox" style="width:20px;" value="1" name="checkbox"></td> 
        <td width="200px"><a href="/admin/feedbackmanager/sortby/2/sortdesc/0">Page Name</a></td> 
        <td width="20px"><a href="/admin/feedbackmanager/sortby/3/sortdesc/0">Add</a></td> 
        </tr> 
        <tr> 
        <td><input type="checkbox" style="width:20px;" value="1" name="checkbox" class="checkbox_check"></td> 
        <td class="td_name">Timeplot</td> 
        <td><input class="add_menu_item_table" name="add_menu_item" value="Add" type="button"></td> 
        </tr> 
        <tr> 
        <td><input type="checkbox" style="width:20px;" value="1" name="checkbox" class="checkbox_check"></td> 
        <td class="td_name">Operations Manuals</td> 
        <td><input class="add_menu_item_table" name="add_menu_item" value="Add" type="button"></td> 
        </tr> 
        <tr> 
        <td><input type="checkbox" style="width:20px;" value="1" name="checkbox" class="checkbox_check"></td> 
        <td class="td_name">Company Structure</td> 
        <td><input class="add_menu_item_table" name="add_menu_item" value="Add" type="button"></td> 
        </tr> 
        <tr> 
        <td><input type="checkbox" style="width:20px;" value="1" name="checkbox" class="checkbox_check"></td> 
        <td class="td_name">CMS Report</td> 
        <td><input class="add_menu_item_table" name="add_menu_item" value="Add" type="button"></td> 
        </tr> 
        <tr> 
        <td><input type="checkbox" style="width:20px;" value="1" name="checkbox" class="checkbox_check"></td> 
        <td class="td_name">Test Document</td> 
        <td><input class="add_menu_item_table" name="add_menu_item" value="Add" type="button"></td> 
        </tr> 
        <tr> 
        <td><input type="checkbox" style="width:20px;" value="1" name="checkbox" class="checkbox_check"></td> 
        <td class="td_name">Test CMS page</td> 
        <td><input class="add_menu_item_table" name="add_menu_item" value="Add" type="button"></td> 
        </tr> 
        </tbody> 
        </table> 
+0

'$ ('input.checkbox_check') चेक किया गया 'चेक' सत्य 'चेक किया गया है, तो' गलत 'अन्यथा – mmcrae

+1

@mmcrae, यह गलत है। JQuery ऑब्जेक्ट में कोई संपत्ति 'चेक' नहीं है। मुझे लगता है कि आपका मतलब '$ ('input.checkbox_check') है [0]। चेक किया गया – Paul

उत्तर

703
if ($('input.checkbox_check').is(':checked')) { 
+1

आप' $ (यह) .closest ('tr') चाहते हैं। '' चेकबॉक्स_चेक ')' – SLaks

+1

कॉफीस्क्रिप्ट में: 'अगर $ ('#my_checkbox') है। 'चेक किया गया' – Dennis

+6

jQuery दस्तावेज़ द्वारा पुष्टि की गई कोड, "यह जांचने के लिए क्रॉस-ब्राउज़र-संगत तरीका है कि चेकबॉक्स चेक किया गया है, संपत्ति का उपयोग करना है: 'अगर (elem.checked)' या 'अगर ($ (elem) .prop (" चेक किया गया)) 'या 'अगर ($ (elem) .is (": चेक किया गया "))"। http://api.jquery.com/prop/ –

90

jQuery 1.6 के लिए या उच्चतर:

if ($('input.checkbox_check').prop('checked')) { 
    //blah blah 
} 

क्रॉस-ब्राउज़र-संगत तरीका निर्धारित करने के लिए एक चेकबॉक्स चेक किया गया है संपत्ति https://api.jquery.com/prop/

+6

की सहायता की है नोट करें कि ".prop() विधि मिलान किए गए सेट में केवल पहले तत्व के लिए संपत्ति मान प्राप्त करती है।" http://api.jquery.com/prop/ देखें –

13

इस $('#checkboxId').is(':checked') का उपयोग के लिए इस $("#checkboxId").prop('checked', true) जाँच करने के लिए करता है, तो

& चेक किया गया है सत्यापित करने के लिए है

& $("#checkboxId").prop('checked', false)

4

अनचेक करने के लिए मुख्य भिन्न देखें एटीटीआर के बीच ence | प्रोप | IS नीचे:

Source: http://api.jquery.com/attr/

$("input") 
 
    .change(function() { 
 
    var $input = $(this); 
 
    $("p").html(".attr('checked'): <b>" + $input.attr("checked") + "</b><br>" + 
 
     ".prop('checked'): <b>" + $input.prop("checked") + "</b><br>" + 
 
     ".is(':checked'): <b>" + $input.is(":checked") + "</b>"); 
 
    }) 
 
    .change();
p { 
 
    margin: 20px 0 0; 
 
    } 
 
    b { 
 
    color: blue; 
 
    }
<meta charset="utf-8"> 
 
    <title>attr demo</title> 
 
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
 
</head> 
 
<body> 
 
    
 
<input id="check1" type="checkbox" checked="checked"> 
 
<label for="check1">Check me</label> 
 
<p></p> 
 
    
 

 
    
 
</body> 
 
</html>

4

ऊपर से कोई भी समाधान किसी भी कारण से काम करते हैं, मेरे मामले की तरह, इस प्रयास करें:

<script type="text/javascript"> 
    $(function() 
    { 
     $('[name="my_checkbox"]').change(function() 
     { 
     if ($(this).is(':checked')) { 
      // Do something... 
      alert('You can rock now...'); 
     }; 
     }); 
    }); 
    </script>