Question

我想为此脚本添加一个check / uncheck all按钮：

PHP：

require_once('includes/commons.php');

$query_get_addresses = 'SELECT * FROM user ORDER BY first_name ASC, last_name ASC';
$result_get_addresses = mysql_query($query_get_addresses);
$addresses_count = mysql_num_rows($result_get_addresses);

?>

脚本：

<script>
$(document).ready(function() {
    // initialize
    var recipient = $('input[name=recipient]').val();
    var recipient_array = new Array();
    if(recipient != '') {
        recipient_array = recipient.split(',');
        for(var i = 0; i < recipient_array.length; i++) {
            recipient_array[i] = $.trim(recipient_array[i]);

            if(recipient_array[i] == '')
                recipient_array.splice(i, 1);
        }

        $('input[type=checkbox]').each(function() {
            if($.inArray(this.value, recipient_array) >= 0) {
                $(this).attr('checked', true);
            }
        });
    }
    // add and/or remove
    $('input[type=checkbox]').click(function() {
        var recipient_list = '';

        $('input[type=checkbox]').each(function() {
            var index = $.inArray(this.value, recipient_array);
            if(this.checked) {
                if(index < 0)
                    recipient_array.push(this.value);
            }
            else {
                if(index >= 0) {
                    recipient_array.splice(index, 1);
                }
            }
        });

        $('input[name=recipient]').val(recipient_array);
    });
});
</script>

HTML：

<h2>Choose recipient</h2>
<div><?php

if($addresses_count > 0) {

    ?><form name="select-recipient-form"><ul><?php

        while($row_get_addresses = mysql_fetch_assoc($result_get_addresses)) {
            $row_get_addresses = unsanitize($row_get_addresses);

            ?><li><input type="checkbox" name="recipient[]" id="recipient-1" value="<?php echo $row_get_addresses['recipient']; ?>" /><label for="recipient-1"><?php echo $row_get_addresses['first_name'].' '.$row_get_addresses['last_name'].' &lt;'.$row_get_addresses['recipient'].'&gt;'; ?></label></li><?php
        }

    ?></ul>
    </form><br /><?php

} else {

    ?><p>You don't have any contacts.</p><?php
}

?>
</div>

我试图遵循一些指南。比如this one，但我无法让它发挥作用。知道我怎么能做到这一点？感谢

Answer 1

这对我有用：

    <script type="text/javascript"> 
$('#form1').ready(function(){
    $('.gumb:button').toggle(function(){
        $('.tocheck ').attr('checked','checked');
        $(this).val('uncheck all')
    },function(){
        $('.tocheck ').removeAttr('checked');
        $(this).val('check all');        
    })
})

</script>

<input type="button" class="gumb" value="check all" />
<input name="checkbox[]" class="tocheck" type="checkbox" value="<?php echo $rows['member_id'] ?>" />

Answer 2

向您添加一个类复选框，然后使用：

<form ...>
    <input type="checkbox" class="check-class" ... />
    ...
    <button type="button" class="check-all">Check All</button>
</form>

<script type="text/javascript">
    (function() {
        var checked = false;
        $('button.check-all').click(function() {
            checked = !checked;
            $('.checkbox-class').prop('checked', checked); // jQuery 1.6+
            if (checked) $(this).text('Uncheck All');
            else $(this).text('Check All);
        });
    })();
</script>

Answer 3

<span><input type="checkbox" class="checkall" />check all</span>

为所有复选框添加一个类，但全部勾选复选框

<input type="checkbox" class="tocheck ... />
    ...
    ....

$(document).ready(function(){
$('.checkall').click(function() {
    $('.tocheck ').attr('checked', true); 
});
});

Answer 4

如果以下是HTML <input class="checkbox-class" type="checkbox" value="1" /><input class="checkbox-class" type="checkbox" value="2" /> <input class="checkbox-class" type="checkbox" value="3" /> <input type="button" id="clickit" value="Check All" />

JS将完成这项工作

$("#clickit").click(function() {
    if ($(this).val() == 'Check All') {
        $('.checkbox-class').attr('checked', 'checked');
        $(this).val('Uncheck All');
    } else {
        $('.checkbox-class').removeAttr('checked');
        $(this).val('Check All');
    }

});

Answer 5

此代码可以正常使用

Jquery的

<script type="text/javascript">
$(document).ready(function(){ 
$("#select_all").change(function(){
  $(".checkbox_class").prop("checked", $(this).prop("checked"));
  });
});
</script>

您只需要将类 checkbox_class 添加到所有复选框

HTML

<input type="checkbox" id="selecctall">

<input class="checkbox_class" name="recipient[]" value="'.$recipientId.'" type="checkbox" />

简单易行：D

Answer 6

仅对我有用（顺便说一句，使用复选框而不是按钮）

aa <- read.csv(file.choose(), row.names = 1)

Answer 7

全部取消选中/全部取消选中复选框遵循以下代码，使用以下代码非常简单

在您的html表单内添加以下代码行

<input type="checkbox" id='checkall' /> Select All

并使用以下脚本代码

 <script type='text/javascript'>
 $(document).ready(function(){
   // Check or Uncheck All checkboxes
   $("#checkall").change(function(){
     var checked = $(this).is(':checked');
     if(checked){
       $(".checkbox").each(function(){
         $(this).prop("checked",true);
       });
     }else{
       $(".checkbox").each(function(){
         $(this).prop("checked",false);
       });
     }
   });
 
  // Changing state of CheckAll checkbox 
  $(".checkbox").click(function(){
 
    if($(".checkbox").length == $(".checkbox:checked").length) {
      $("#checkall").prop("checked", true);
    } else {
      $("#checkall").removeAttr("checked");
    }

  });
});
</script>

请记住，脚本代码中的.checkbox是html表单中其他复选框的类名

例如，如果您具有如下所示的输入复选框

<input class="checkbox" name="emailid[]" type="checkbox" value="<?php echo $email;?>" />

添加选择所有复选框

7 个答案: