jquery 实现 邮箱的 全选/全不选 全选与全不选功能

最新推荐文章于 2021-03-26 15:57:13 发布
最新推荐文章于 2021-03-26 15:57:13 发布
阅读量257 收藏
点赞数
分类专栏： jQuery javaScript 文章标签： javascript ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/JACKASDFGHJKL/article/details/84450579
版权

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
     <script src="c:\jquery.js""></script>
  </head>
       <script>
//                      全选/全不选   
                       $(function(){
                      //  alert(true&&false);
                        $("#checkboxAll").click(function(){
                                $("[name=items]:checkbox").attr("checked",this.checked)
                        });

//                      反选                       
                        $("#checkRev").click(function(){
                                $("[name=items]:checkbox").each(function(){
                                    this.checked=!this.checked;
                                });
                        });   
//                      绑定
                        $("[name=items]:checkbox").click(function(){
                               var flag=true;
                                $("[name=items]:checkbox").each(function(){
                                    if(!this.checked){
                                        flag=false;
                                        return false;
                                       
                                    }                                                               
                                });
                                $("#checkboxAll").attr("checked",flag);
                        });
                 })
       </script>
   <body>
       你喜欢的水果是?
       <input type="checkbox" id="checkboxAll">全选/全不选</input><br>
   
       <input type="checkbox" name="items">苹果</input>
       <input type="checkbox" name="items">香蕉</input>
       <input type="checkbox" name="items">西瓜</input>
       <input type="checkbox" name="items">葡萄</input><br>
       <input type="button" id="checkRev" value="反选"></input><br>
   </body>
</html>

JACKASDFGHJKL
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jquery 全选 全不选 批量删除
闫瑞祥的博客
09-11 564
jquery 实现全选反选批量删除 全选全不选按钮然后点击批量删除 < th >全选 < input type=“checkbox” id=“theadInp” />< /th > <input name=“ids” class=“ids” type=“checkbox” value="{{$v.id}}" / > $(function() { //实现全选反选 $("#theadInp").on('click', function
JavaScript高手之路：全选、不选、反选效果
张翠山的博客
02-15 1264
前几个章节已经讲述了JavaScript对象定义的几种方式，并且用构造函数方式和字面来嗯方式来封装了一些数学相关的类和一些简单的特效，相信读者对JS面向对象编程有个大概轮廓了。 所以，接下来的几个章节，每个章节就是一个简单有趣的小案例，这样有利于我们对JS对象封装的学习兴趣。今天我们先来实现全选、不选、反选的效果，这个效果在网页中经常见到，比如网易邮箱。
jquery写个checkbox——类似邮箱全选功能
12-10
以前用原生 JS 写过 checkbox——类似邮箱全选功能，点击这里。最近在学习jquery，今天抽空用jquery 写个checkbox——类似邮箱全选功能。 代码如下: <!DOCTYPE HTML> <html lang=”en-US”> <head> <meta charset=”UTF-8″> <title>checkbox</title> </head> <body> <input type=”checkbox” name=”btn” id=”btn”/><label for=”btn”>全选/全不选</label><br> <input type=”checkbox” na
【jquery】checkbox——类似邮箱全选功能
dengrongshou5105的博客
03-18 87
以前用原生 js 写过checkbox——类似邮箱全选功能，点击这里。最近在学习 jquery，今天抽空用 jquery 写个。 <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>checkbox&lt...
jquery实现全选、全不选以及单选功能
12-30
效果图： 代码如下： <link rel=stylesheet href=http://wiki.jikexueyuan.com/project/bootstrap4/dist/css/bootstrap.min.css rel=external nofollow > [removed] [removed] <t
jQuery全选全不选&删除&批量删除
weixin_46981685的博客
04-13 257
jQuery全选全不选&删除&批量删除 1.全选全不选 2.删除 Controller层 Mapper
js与jQuery实现checkbox复选框全选/全不选的方法
11-24
本文实例讲述了js与jQuery实现checkbox复选框全选/全不选的方法。分享给大家供大家参考，具体如下： 先来看看JavaScript实现checkbox复选框全选/全不选的方法。这应该是一个比较实用的前端技巧吧，很多时候我们都...
使用html + jquery实现页面表格的增加，删除，批量删除，全选，反选功能。
qq_42797435的博客
03-26 1437
笔记 2021-3-26 demo 使用html + jquery实现页面表格的增加，删除，批量删除，全选，反选功能。 页面效果如下 html 代码如下 <div> <div> <input type="button" value="批量删除" onclick="dels()"/> <input type="button" value="反选" onclick=
jQuery实现全选效果
Chris Mao的专栏
03-23 1260
多选效果如下图代码如下:<!-- $(document).ready(function() { $("#selectall").click(selectAll); }); function selectAll() { var checked = $("#selectall").attr("checked");
jquery中的全选、反选、全不选和单删、批删
dingzong4331的博客
10-18 158
HTML页面 <!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1...
Jquery仿163收件人效果+邮箱验证
07-26
Jquery仿163收件人效果加邮箱验证以及autocomplete模糊匹配查询效果
jquery全选-全不选，删除，批删
马冠亚的博客
12-15 364
全选和全不选 $(document).on('click','#quan',function(){ var name_va = $(this).prop('name');//获取标签的name值 if(name_va == '全选'){ $("input[type='checkbox']").each(function(i,v) $...
jquery checkbox全选删除
XiaoZhuang__的博客
12-05 517
用户:          密码:          邮箱:                                                                      用户名                   密码                   邮箱                   操作                   
JQuery操作全选与全不选,批量进行删除
小小的心,有大大的梦的博客
04-18 700
引入jquery.js的插件 编写html 此处要注意,html中的id不能重复,所以在单选的input中用class 来做标记 编写JQ: //通过事件来改变选中值 $(function () { $(’#allCheck’).click(function () { $(’.check’).prop(‘checked’,this.checked); }) }) ...
JS实现全选、全不选的email效果
sweetllh的博客
04-15 395
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div><input type="checkbox" id="checkAll"/>全选/全不选</div> <ul>
jQuery全选全不选 批量删除
lian895615的博客
12-05 2378
.table{                 width: 60%;             }                               $(function(){                 $("#btn").click(function(){                     selnull();                     $("
Dom编程（邮件的全选、反选、删除选中项）
程序员
08-20 736
邮件的全选、反选、删除选中项 table{ border:1px solid #06F; width:60%; } th{ background-color:#0C0; } td, th{ border:1px solid #00C; } .one{ background-color:#FF0; } .two{ background-color:#0CF; } .over{ bac
使用JQuery实现全选、反选、添加和删除功能
qizhichao110的专栏
05-06 2366
练习要求： 1.班级 姓名 薪水 就业单位  是否转正 2.全选，取消全选，反选 3.实现删除功能：删除一行或多行 4.实现添加功能。添加一行。                  table         {             width: 600px;             height: 400px;         }         table t
jQuery添加删除,全选反选,批量删除
xiaozi_11的博客
12-10 329
练习                                                                                                    用户名                                                                            密码   
js实现全选/全不选功能
最新发布
03-31
解释：首先通过 `getElementById` 和 `getElementsByClassName` 方法获取全选/全不选按钮和所有的复选框，然后为全选/全不选按钮和每个复选框分别绑定点击事件。全选/全不选按钮点击事件中，遍历所有复选框，并将...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值