jQuery如果checkbox被选中

我有一个函数,我只想在同一个tr中的checkbox被选中时触发。 请告诉我我做错了什么,通常的方法是行不通的。 谢谢

JS

$(".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; 

HTML

 <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> 
 if ($('input.checkbox_check').is(':checked')) { 

对于jQuery 1.6或更高版本:

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

确定checkbox是否被选中的跨浏览器兼容方式是使用属性https://api.jquery.com/prop/

这个$('#checkboxId').is(':checked')来validation是否被选中

&this $("#checkboxId").prop('checked', true)来检查

$("#checkboxId").prop('checked', false)取消选中

如果以上解决scheme都不能以任何理由工作,比如我的情况,请尝试以下操作:

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

查看ATTR |之间的主要区别 PROP | IS如下:

资料来源: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>