用JQuery实现正选，全选，反选功能

最新推荐文章于 2021-08-16 10:49:48 发布
最新推荐文章于 2021-08-16 10:49:48 发布
阅读量230 收藏
点赞数 3
分类专栏： 基础 文章标签： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49554199/article/details/108830894
版权
全选 反选
  • 张三
  • 李四
  • 麻五
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200927164453426.png#pic_center)

HTML代码如下
在这里插入图片描述

JQuery代码
全选按钮
在这里插入图片描述
反选按钮
在这里插入图片描述
点击复选，选中全选按钮
在这里插入图片描述

H大东
关注
  • 3
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
使用jquery实现全选反选效果
HAI6545的博客
01-17 164
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src =" https://code.jquery.com/jquery-3.6.0.min.js "></script> </head> <body> <but...
仿复选框、全选、反选、删除功能等
05-16
仿复选框、全选、反选、删除功能等.些代码纯手工打造
jquery实现全选 反选功能
Zhang_xiao_pang的博客
10-09 380
如何利用jquery是先简单的全选反选功能 首先我们需要载页面中引入jQuery``` 然后我们需要引入input标签 ` 全选 反选 `
用 jQuery 实现全选/反选功能
qq_45093219的博客
05-26 1657
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
jQuery代码实现全选反选功能
weixin_44810547的博客
03-21 862
jQuery代码实现全选反选功能 <title>全/全不选，反选</title> <script type="text/javascript" src="js/jquery-1.8.2.js"></script> <script type="text/javascript"> function qx() { if($(":checkbo...
使用JQuery实现全选、反选、添加和删除功能
qizhichao110的专栏
05-06 2354
练习要求： 1.班级 姓名 薪水 就业单位  是否转正 2.全选，取消全选，反选 3.实现删除功能：删除一行或多行 4.实现添加功能。添加一行。                  table         {             width: 600px;             height: 400px;         }         table t
鼠标框选,即用鼠标拉出虚框，框选所有复选框，并可反选
03-08
鼠标框选多选框,即用鼠标拉出虚框框选所有复选框，并可反选，测试通过，非常实用。鼠标框选多选框,即用鼠标拉出虚框框选所有复选框，并可反选，测试通过，非常实用
DAC.zip_DAC_LPC1768DAC正选表_LPC1768模版
09-22
这个是lpc1768的DA的输出数据，这使用工程模版开发的便于移植！
播放正选波和方波
05-07
播放正选波和方波
dsp 正选函数
03-25
dsp 正选函数
JQuery实现全选、全不选、反选功能
12-12
JQuery实现全选、全不选、反选功能 1、当点击'全选'按钮时，页面中所有的复选框都应该为选中状态， 1.1、当再次点击'全选'按钮时，所有的复选框应该是非选中状态。 1.2、当点击子复选框时，'全选'按钮应该是非选中状态。 2、当选中当前页面的所有子复选框时，'全选'按钮应该是'选中'状态。 3、点点击'全不选'按钮时，当前页面的所有复选框置为非选中状态。 4、当点击'反选'按钮时，当前页面选中状态的复选框置为未选中状态，未选中状态的复选框置为选中状态。
css、jquery智能反选
02-28
jquery实现全选、智能反选以及css样式的一个html代码文件
jQuery 实现全选、全不选、反选 功能
VirgoYellow 的专栏
08-30 303
方法：使用 prop() 来设置 "checked" 属性的值，true 为选中，false 为未选中，在整个全选、反选过程中注意处理全选复选框的选中状态。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" cont...
jQuery实现简单全选、反选、全不选功能
何明洋的编程技术博客
07-03 1252
例子：&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"/&gt; &lt;title&gt;&lt;/title&gt; &lt;meta charset="ut
jquery全选，jquery全不选,jquery反选
热门推荐
hexytxl的专栏
08-26 6万+
全选，不全选，反选 $(function () { $("#selectAll").click(function () {//全选 $("#playList :checkbox"
jquery下的正反选操作
weixin_30511107的博客
06-14 111
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jquery正反选</title> </head> <body> <button onclick='selectall()'...
jquery 全反选
weixin_30708329的博客
08-02 292
function rev_sel(name){ var check_obj = $("input[name='"+name+"']"); for(var i=0; i<check_obj.length;i++){ check_obj.get(i).checked = ! check_obj.get(i).checked; } return;} 转载于:https://w...
jquery全选反选功能
yingshuangtu的博客
08-16 1461
代码 使用jquery超简洁代码实现点击按钮，全选，反选 功能代码 <script> //全选/取消全选 $("#all").click(function(){ $(":checkbox").prop("checked",true); }) //反选 $("#reverse").click(function(){ $(":checkbox").each(function(i,e){ $(e).prop("checked",!$(e).prop
jq 全选，全不选 ，反选 获取选取项的值
Think More 的博客
03-30 715
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>反选、全选、全不选</title> <script type="text/javascript" src="jquery-1.12.4.js"></script&...
echarts框选怎么判断反选和正选
最新发布
05-30
ECharts 框选组件（brush）可以通过设置brush.selected属性来获取框选后的选中状态。该属性是一个数组，其中的每个元素代表一个坐标系（如x轴或y轴）的选中状态。每个坐标系的选中状态是一个包含起始值和结束值的数组，表示选中的范围。 对于反选和正选的判断，可以通过比较选中状态和数据源的状态来实现。具体做法是，首先将数据源的状态保存在一个数组中，然后将选中状态中的数据项标记为选中状态，未选中的数据项标记为未选中状态。最后，遍历数据源数组，比较每个数据项的状态和选中状态中的状态是否一致，如果不一致，则表示该数据项被反选。 以下是一个示例代码片段，展示了如何在ECharts中获取框选后的选中状态，并判断正选和反选： ```javascript var data = [ {name: 'A', value: 10}, {name: 'B', value: 20}, {name: 'C', value: 30}, {name: 'D', value: 40}, {name: 'E', value: 50}, {name: 'F', value: 60}, {name: 'G', value: 70} ]; option = { xAxis: { type: 'category', data: ['A', 'B', 'C', 'D', 'E', 'F', 'G'] }, yAxis: { type: 'value' }, brush: { toolbox: ['rect', 'clear'], xAxisIndex: 0 }, series: [{ type: 'bar', data: [10, 20, 30, 40, 50, 60, 70] }] }; var selected = []; // 保存选中状态的数组 // 监听brushselected事件，获取选中状态 myChart.on('brushselected', function(params) { var xAxisIndex = params.batch[0].xAxisIndex; var brushData = params.batch[0].selected[xAxisIndex]; selected[xAxisIndex] = brushData; // 遍历数据源数组，判断正选和反选 for (var i = 0; i < data.length; i++) { var item = data[i]; var value = item.value; var isSelected = false; // 判断该数据项是否被选中 if (selected[xAxisIndex]) { for (var j = 0; j < selected[xAxisIndex].length; j++) { var range = selected[xAxisIndex][j]; if (value >= range[0] && value <= range[1]) { isSelected = true; break; } } } // 判断正选和反选 if (isSelected && !item.isSelected) { console.log(item.name + ' is selected'); item.isSelected = true; } else if (!isSelected && item.isSelected) { console.log(item.name + ' is unselected'); item.isSelected = false; } } }); ``` 在上述代码中，我们首先创建了一个数组selected，用于保存选中状态。然后，在brushselected事件中获取选中状态，并保存在selected数组中。最后，遍历数据源数组，比较每个数据项的状态和选中状态中的状态是否一致，输出正选和反选的结果。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值