1

我想为此脚本添加一个选中/取消选中所有按钮：

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>

我试图遵循一些指南。例如，就像这个，但我无法让它工作。知道如何实现这一目标吗？谢谢

4

7 回答 7

2

这对我有用：

    <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'] ?>" />
于 2019-02-20T10:09:33.400 回答
1

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

<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>
于 2012-05-07T11:12:30.480 回答
0

如果以下是 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');
    }

});
于 2012-05-07T15:56:44.390 回答
0 
<span><input type="checkbox" class="checkall" />check all</span>

向所有复选框添加一个类，除了全选复选框

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

$(document).ready(function(){
$('.checkall').click(function() {
    $('.tocheck ').attr('checked', true); 
});
});
于 2012-05-07T11:16:31.380 回答
0

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

<script type="text/javascript">
$(document).ready(function(){
    $('#select_all').on('click',function(){
        if(this.checked){
            $('.checkbox').each(function(){
                this.checked = true;
            });
        }else{
             $('.checkbox').each(function(){
                this.checked = false;
            });
        }
    });

    $('.checkbox').on('click',function(){
        if($('.checkbox:checked').length == $('.checkbox').length){
            $('#select_all').prop('checked',true);
        }else{
            $('#select_all').prop('checked',false);
        }
    });
});
</script>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js'></script>


<ul class="main">
    <li><input type="checkbox" id="select_all" /> Select all</li>
    <ul>
        <li><input type="checkbox" class="checkbox" value="1"/>Item 1</li>
        <li><input type="checkbox" class="checkbox" value="2"/>Item 2</li>
        <li><input type="checkbox" class="checkbox" value="3"/>Item 3</li>
        <li><input type="checkbox" class="checkbox" value="4"/>Item 4</li>
        <li><input type="checkbox" class="checkbox" value="5"/>Item 5</li>
    </ul>
</ul>
于 2019-11-04T00:14:37.613 回答
0

这段代码适用于我

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

于 2015-11-09T15:38:57.573 回答
0

Check-uncheck all / select-unselect all checkboxes 按照下面的代码，下面的代码真的很简单

在您的 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;?>" />
于 2020-07-30T08:00:33.907 回答