yii中jquery全选全不选全选全部选反选

最新推荐文章于 2024-04-16 09:46:36 发布

pydboke

最新推荐文章于 2024-04-16 09:46:36 发布

阅读量313

点赞数

分类专栏： php 文章标签： yii

本文链接：https://blog.youkuaiyun.com/pydboke/article/details/52623191

版权

php 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一个使用PHP实现的用户管理页面，展示了如何通过遍历数据数组来填充表格中的用户信息，并提供了包括删除和修改链接在内的操作选项。此外，还实现了多种选择功能，如全选、全不选、反选等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
   <title>Document</title>
</head>
<body>
   <center>
       <form action="">
           <table border='1'>

               <tr>
                   <td>id</td>
                   <td>用户名</td>
                   <td>密码</td>
                   <td>操作</td>
                   <td>图片</td>
               </tr>
       <?php    foreach ($data as $v) {?>
               <tr>

                   <td><input type="checkbox" name='box' value="<?php echo $v['id'];?>"/><?php echo $v['id'];?></td>
                   <td><?php echo $v['u_name'];?></td>
                   <td><?php echo $v['u_pwd'];?></td>
                   <td><img src="<?php echo $v['u_file']?>" width="50"    /></td>
                   <td>
                       <a href="index.php?r=index/delete&id=<?=$v['id']?>">删除</a>
                       <a href="index.php?r=index/update&id=<?=$v['id']?>">修改</a>
                   </td>
               </tr>
               <?php } ?>
           </table>
           <input type="checkbox" id="post" /> 全选
           <input type="button" value="全选" id="posts" />
           <input type="button" value="全不选" id="pos" />
           <input type="button" value="全选全不选" id="qf" />
           <input type="button" value="反选" id="fx" />
           <input type="button" value="确定" id="getadd" />
           <div id="arr"></div>
           <?php
               use yii\widgets\LinkPager;
               echo LinkPager::widget(['pagination' => $pages]);
           ?>
       </form>
   </center>


<script type="text/javascript" src="jquery.1.12.js"></script>

<script>

   $(function(){
//获取id
       $("#getadd").click(function() {

           text = $("input:checkbox[name='box']:checked").map(function(index,elem) {
               return $(elem).val();

           }).get().join(',');
           //$('#arr').val(text);
           alert("选中的checkbox的值为："+text);
       });


   });
       //全选
        $("#posts").click(function(){
                $(":input[name='box']").prop("checked",true);
            })

            //全不选
            $("#pos").click(function(){
                $(":input[name='box']").prop("checked",false);
            })
      //全选全不选
           $("#qf").click(function(){
            var box = $(":input[name='box']");
            if(box.prop("checked") == false)
            {
                box.prop("checked",true);
            }
            else
            {
                box.prop("checked",false);
            }
        })
           //反选
            $("#fx").click(function(){
                var box = $(":input[name='box']");

                box.each(function(){
                    this.checked=!this.checked;
                })
            })

</script>
</body>

</html>