Question

我需要选择生成的表中的所有复选框。我已经使用了这个jquery代码，但它似乎无法正常工作。显示复选框。对于这个混乱的代码很抱歉，但我不确定什么是重要的，什么不是。谢谢你的帮助

<input type="checkbox" id="selectAll" />
    <table>
        <tbody>
            <tr class='edit_row'>
                <input type='hidden' name='fields[]' value='<?php echo $field_id; ?>' />
                <td><label class='edit_label' for='<?php echo $name; ?>'><?php echo $label; ?></label></td>
                <td>
<?php if ($type == 'checkbox') {  ?>
<?php   $checked = ($value == 'checked') ? " checked='checked'" : ''; ?>
                    <label>
                        <input id='<?php echo $name; ?>' class='edit_checkbox' type='checkbox' name='<?php echo $name; ?>' value='checked'<?php echo $checked; ?> />
                    </label>
<?php } elseif ($type == 'date') { ?>   
                    <input id='<?php echo $name; ?>'<?php echo $class; ?> type='text' name='<?php echo $name; ?>' value='<?php echo $value; ?>' />
<?php } elseif ($type == 'radio') { ?>                      
                    <?php $this->radio_buttons($field_id, $name, $value, $required); ?>                 
<?php } elseif ($type == 'select') { ?>     
                    <select id='<?php echo $name; ?>'<?php echo $class; ?> name='<?php echo $name; ?>'>
                        <?php $this->select_options($field_id, $value); ?>
                    </select>
<?php } elseif ($type == 'text') { ?>
                    <input id='<?php echo $name; ?>'<?php echo $class; ?> type='text' name='<?php echo $name; ?>' value='<?php echo $value; ?>' />
<?php } elseif ($type == 'textarea') {  ?>
                    <textarea id='<?php echo $name; ?>'<?php echo $class; ?> name='<?php echo $name; ?>'><?php echo $value; ?></textarea>                           
<?php } ?>
                </td>
                <td>
<?php if ($required) { ?>
                    <span class='required_input'><?php _e('Required', CA_PLUGIN_NAME); ?></span>
<?php } ?>
                </td>
            </tr>
<?php } ?>
        </tbody>
    </table>
<script>

    $( document ).ready(function() {
        $('#selectAll').click(function(e){
            var table= $(e.target).closest('table');
            $('td input:checkbox',table).prop('checked',this.checked);
        });
    console.log( "I'm alive!" );
});

</script>
<?php //END

更新

这是我现在使用的代码。可悲的是，它仍然无法正常工作

<input type="checkbox" id="selectAll" />
    <table>
        <tbody>
<?php
            <tr class='edit_row'>
                <input type='hidden' name='fields[]' value='<?php echo         $field_id; ?>' />
                <td><label class='edit_label' for='<?php echo $name; ?>'><?    php echo $label; ?></label></td>
                <td>
<?php if ($type == 'checkbox') {  ?>
<?php   $checked = ($value == 'checked') ? " checked='checked'" : ''; ?>
                    <label>
                        <input id='<?php echo $name; ?>'     class='edit_checkbox checkBoxClass' type='checkbox' name='<?php echo $name; ?>'     value='checked'<?php echo $checked; ?> />
                    </label>
                </td>
            </tr>
<?php } ?>
        </tbody>
</table>
<script>

    $( document ).ready(function() {
        $("#selectAll").click(function () {
            $(".checkBoxClass").prop('checked', $(this).prop('checked'));
        });

    console.log( "ready!" );
});

</script>

Answer 1

尝试以下代码。当然有效。

$("#selectAll").click(function () {
    $(".checkBoxClass").prop('checked', $(this).prop('checked'));
});

Answer 2

为此，首先，您需要将一个公共类推入此表的所有复选框。

然后编写jquery代码

  $(document).ready(function(){
   $("#selectAll").click(function(){
           $(".commonClass").prop('checked',$(this).prop('checked'));
       });
  })

Answer 3

使用这个希望它的工作。

$(document).on('change', '#selectAll', function(e) {
    if($(this).prop('checked')){
      $('.checkBoxClass').prop('checked', true);
    }else{
      $('.checkBoxClass').prop('checked', false);
    }
});

Answer 4

正确选择你的桌子，桌子不是父母，而是兄弟姐妹

 var table= $(this).next('table');

Answer 5

我在http://api.jquery.com/prop/上找到了以下内容，这对我有用。

$(document).ready(function(){
    $( "input" ).prop( "checked", true );
});

并为两个按钮编辑，一个选择全部选择，另一个选择全部取消选择。

$(document).ready(function(){
    // select all checkboxes
    $("#selectAll").click(function () {
        $( ".checkSpecialties" ).prop( "checked", true );
    });

    // deselect all checkboxes
    $("#selectNone").click(function () {
        $( ".checkSpecialties" ).prop( "checked", false );
    }); 
});

选中生成的表中的所有复选框

5 个答案: