使用jquery 对checkbox的操作

最新推荐文章于 2024-08-14 11:55:10 发布
最新推荐文章于 2024-08-14 11:55:10 发布
阅读量604 收藏
点赞数
分类专栏： java前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/rush_future/article/details/14167755
版权
<%@ page language="java" contentType="text/html; charset=GBK"
pageEncoding="GBK"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>list page</title>

<script type="text/javascript" src="/ipsm/js/jqwidgets/scripts/jquery-1.10.2.min.js"></script>


<script type="text/javascript">
$(document).ready(function(){
//使用checkedbox管理
$("input[name=all]").click(function(){
var value=$("input[name=all]").is(":checked");
var books=$("input[name=cbx]");
value?books.attr("checked",true):books.attr("checked",false);
});


//全选
$("input[name=btnOk]").click(function(){
$("input[name=cbx]").attr("checked",true);
checkAll();
});
//全不选
$("input[name=btnNo]").click(function(){
$("input[name=cbx]").attr("checked",false);
checkAll();
});


//反选
$("input[name=btnReturn]").click(function(){
$("input[name=cbx]").each(function(){
var value=$(this).is(":checked");
if(value==true){
$(this).attr("checked",false);
}else{
$(this).attr("checked",true);
}
});
checkAll();
});
$("input[name=cbx]").click(function(){
checkAll();
})


function checkAll(){
var countOK=0;
var countNO=0;
$("input[name=cbx]").each(function(){
var value=$(this).is(":checked");
if(value==true){
countOK++;
}else{
countNO++;
}

});  
if(countOK==3){
$("input[name=all]").attr("checked",true);
}
if(countNO==3){
$("input[name=all]").attr("checked",false);
}


}
checkAll();

});  




    
</script>
</head>
<body class='default'>
<div>
<table border="1" id="newsTable">
<tr>
<th><input type="checkbox" name="all" /></th>
<th>Id</th>
<th>作者</th>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>1</td>
<td>阿会楠</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>2</td>
<td>阿会楠</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>3</td>
<td>阿会楠</td>
</tr>
<tr>
<td colspan="3"><input type="button" name="btnOk" id="btnOk" value="全选" /></td>
<td colspan="3"><input type="button" name="btnNo" id="btnNo" value="全不选" /></td>
<td colspan="3"><input type="button" name="btnReturn" id="btnReturn" value="反选" /></td>
</tr>
</table>
</div>
</body>
</html>
蒙蒙-博客
关注
专栏目录
jQuery操作checkbox选择
pplsunny----舞动青春
06-28 2620
禁止星期： @Html.CheckBoxList("weekdays", true) @Html.ValidationMessageFor(m => m.checkWeekdays) ===============
jquery 对checkbox的操作
03-01
博文链接：https://qsfwy.iteye.com/blog/236001
checkbox标签的一些用法(jQuery操作)
Lumia
07-23 740
//监听选中事件 $("#checkbox1").change(){ //判断是否为选中状态 //也可以这样$(this).prop("checked") if($(this).is(":checked")){ //do something }else{ //other } } //改变checkbox的状态 $("#check
关于JQ对checkbox的click事件触发的一个坑
热门推荐
webjhh的博客
03-11 6万+
今天插件里的遇到一个坑困扰我很久，写了一个键盘事件触发input的click事件来改变选项值，一直不正确，测试了好久终于发先问题出在input点击时改变checked和执行click事件的顺序上。写一个小demo。 html:写两个多选框 初始状态： jQ：写法 $("#cs2").click(function(){     $("#cs1").click
jQuery对checkbox的各种操作
slongzhang的博客
07-21 7435
//注意： 操作checkbox的checked,disabled属性时jquery1.6以前版本用attr,1.6以上（包含）建议用prop //1、根据id获取checkbox $("#cbCheckbox1"); //2、获取所有的checkbox $("input[type='checkbox']");//or $("input[name='cb']"); //3、获取所有选中的checkbox $("input:checkbox:
jQuery操作复选框checkbox
IT开发
08-07 171
【代码】jQuery操作复选框checkbox。
jQuery实现checkbox单选
cheng1a的博客
08-14 316
【代码】jQuery实现checkbox单选。
用jQuery对checkbox的checked进行操作
老郭的博客
03-05 7984
注意： 操作checkbox的checked,disabled属性时jquery1.6以前版本用attr, 1.6以上（包含）建议用prop 1、根据id获取checkbox $("#Checkbox1"); 2、获取所有的checkbox $("input[type='checkbox']");//或者$(":checkbox"); 3、获取所有选中的checkbo...
jQuery对checkbox的各种操作（详细）
TofuCai的博客
10-30 310
1 //注意： 操作checkbox的checked,disabled属性时jquery1.6以前版本用attr,1.6以上（包含）建议用prop 2 3 //1、根据id获取checkbox 4 $("#cbCheckbox1"); 5 6 //2、获取所有的checkbox 7 $("input[type='checkbox']");...
jquery 操作 checkbox 相关方法
悟世君子的博客
11-29 1385
使用 jquery 操作 checkbox ，相关方法如下 1、设置 checkbox 选中 使用prop("checked", true) 方法 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="js/jquery-3.2.1.min.js"&g..
JQuery对checkbox操作 （循环获取）
10-28
在本示例中，我们关注的是 jQuery 对 checkbox 的操作，特别是如何进行全选、反选、取消全选以及按特定条件选择 checkbox。下面将详细解析这些功能的实现方式： 1. **全选**： 当用户点击“全选”按钮（id="btn1...
jQuery 对checkbox的操作
03-09
jQuery 对checkbox的操作
jQuery获取checkbox选中的值
10-22
理解并掌握如何使用jQuery获取和操作checkbox元素，对于开发交互式的Web应用程序非常重要。上述示例和知识点提供了全面的指南，帮助开发者在实际项目中有效地应用这些技术。通过实践这些方法，开发者可以构建更为...
jQuery对checkbox的操作
leo_618的专栏
04-11 258
http://blog.csdn.net/hu_shengyang/article/details/6437729$(document).ready(function(){ //checkbox全选 $('#btn1').click(function(){ $("[name = 'checkbox']").attr('checked',true);
yolo算法-电线杆数据集-1493张图像带标签-.zip
11-17
yolo算法-电线杆数据集-1493张图像带标签-.zip；yolo算法-电线杆数据集-1493张图像带标签-.zip；yolo算法-电线杆数据集-1493张图像带标签-.zip
yolo算法-电线杆数据集-7255张图像带标签-杆顶.zip
11-17
yolo算法-电线杆数据集-7255张图像带标签-杆顶.zip；yolo算法-电线杆数据集-7255张图像带标签-杆顶.zip；yolo算法-电线杆数据集-7255张图像带标签-杆顶.zip；yolo算法-电线杆数据集-7255张图像带标签-杆顶.zip
pillow_avif_plugin-1.2.1-cp37-cp37m-win32.whl.rar
11-17
python whl离线安装包 pip安装失败可以尝试使用whl离线安装包安装 第一步 下载whl文件，注意需要与python版本配套 python版本号、32位64位、arm或amd64均有区别 第二步 使用pip install XXXXX.whl 命令安装，如果whl路径不在cmd窗口当前目录下，需要带上路径 WHL文件是以Wheel格式保存的Python安装包， Wheel是Python发行版的标准内置包格式。 在本质上是一个压缩包，WHL文件中包含了Python安装的py文件和元数据，以及经过编译的pyd文件， 这样就使得它可以在不具备编译环境的条件下，安装适合自己python版本的库文件。 如果要查看WHL文件的内容，可以把.whl后缀名改成.zip，使用解压软件（如WinRAR、WinZIP）解压打开即可查看。 为什么会用到whl文件来安装python库文件呢？ 在python的使用过程中，我们免不了要经常通过pip来安装自己所需要的包， 大部分的包基本都能正常安装，但是总会遇到有那么一些包因为各种各样的问题导致安装不了的。 这时我们就可以通过尝试去Python安装包大全中（whl包下载）下载whl包来安装解决问题。
【地震】基于matlab时域有限差分FDTD模拟地震盾构【含Matlab源码 9186期】.mp4
最新发布
11-17
Matlab领域上传的视频均有对应的完整代码，皆可运行，亲测可用，适合小白； 1、代码压缩包内容 主函数：main.m； 调用函数：其他m文件；无需运行 运行结果效果图； 2、代码运行版本 Matlab 2019b；若运行有误，根据提示修改；若不会，私信博主； 3、运行操作步骤 步骤一：将所有文件放到Matlab的当前文件夹中； 步骤二：双击打开main.m文件； 步骤三：点击运行，等程序运行完得到结果； 4、仿真咨询 如需其他服务，可私信博主； 4.1 博客或资源的完整代码提供 4.2 期刊或参考文献复现 4.3 Matlab程序定制 4.4 科研合作
掌握jquery操作checkbox选中值的技巧
jQuery作为一个广泛使用的JavaScript库，极大地简化了对DOM元素的操作。本资源将详细介绍如何使用jQuery获取复选框（checkbox）选中的值，包括实现全选、取消全选、反选、选中奇数行等功能。 1. 获取单个复选框选中...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值