快速取出选中checkbox的值
原料:jquery
直接上代码
html代码
<html>
<head>
<title>$Title$</title>
</head>
<body> <input type="checkbox" value="男">男<br/>
<input type="checkbox" value="女">女<br/> <input type="checkbox" value="男1">男1<br/>
<input type="checkbox" value="女2">女2<br/> <input type="checkbox" value="男3">男3<br/>
<input type="checkbox" value="女4">女4<br/> <input type="button" id="btn" value="btn">
<script src="/assets/js/jquery1.12.4.js"></script>
</body>
</html>
script代码
<script>
$("#btn").click(function () {
var re = [];
$("body").find("input[type='checkbox']:checked").each(function() {re.push($(this).val());
})
console.log(re.join("/"));
}); ; </script>
实例:

结果:

另一种写法(编译器编辑 语法可能会变成红色的,不影响使用)
原料:css3的选择器
html代码
<html>
<head>
<title>$Title$</title>
</head>
<body> <input type="checkbox" value="男">男<br/>
<input type="checkbox" value="女">女<br/> <input type="checkbox" value="男1">男1<br/>
<input type="checkbox" value="女2">女2<br/> <input type="checkbox" value="男3">男3<br/>
<input type="checkbox" value="女4">女4<br/> <input type="button" onclick="box()" value="btn1" />
<script> function box() {
var res = [];
document.querySelectorAll("body input:checked").forEach((e)=>{
if(e.checked){
res.push(e.value);
}
});
console.log(res.join("/"));
} </script>
</body>
</html>
结果:

快速取出选中checkbox的值的更多相关文章
- js实现获取选中checkbox的值
var bookVersionId = []; var examVirtualSetResultId; $.each($('input[type=checkbox]:checked'),functio ...
- Jquery常用radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置
获取一组radio被选中项的值:var item = $('input[name=items][checked]').val(); 获取select被选中项的文本:var item = $(" ...
- easyui 》 radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中
获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...
- checkbox 选中、取值处理
[1].[代码] checkbox 选中.取值处理 跳至 [1] ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 ...
- jquery radio取值,checkbox取值,select取值及选中
jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关 获取一组radio被选中项的值 var item = $('in ...
- 设置checkbox选中,设置radio选中,根据值设置checkbox选中,checkbox勾选
设置checkbox选中,设置radio选中,根据值设置checkbox选中,checkbox勾选 >>>>>>>>>>>>&g ...
- JavaScript- 获得TreeView CheckBox里选中项的值
获得TreeView CheckBox里选中项的值,对JSDOM控制还不是很熟,感觉不太容易.试了很多次终于成功了. 代码如下 <body> <form id="form1 ...
- 解决easyui datagrid加载数据时,checkbox列没有根据checkbox的值来确定是否选中
背景: 昨天帮朋友做一个easyui datagrid的小实例时,才发现easyui datagrid的checkbox列,没有根据值为true或false来选中checkbox,当时感觉太让人失 ...
- jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中
jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...
随机推荐
- MySQL_数据表命令
目录 数据表操作 1.创建数据表: 2. 修改表结构: 数据表查看 1.查看数据库中所有表的信息 2.查看表结构 3.查看创建表时所输入的命令 4.删除数据表 数据表操作 关于Mysql的数据类型,点 ...
- #学习笔记:CentOS7学习之十三(2):磁盘介绍与管理
1.磁盘分区工具与挂载 1.1 硬盘分区符认识: MBR概述:全称为Master Boot Record,即硬盘的主引导记录. 硬盘的0柱面.0磁头.1扇区称为主引导扇区(也叫主引导记录MBR).它由 ...
- matplotlib库的基本使用与折线图
matplotlib:最流行的Python底层绘图库,主要做数据可视化图表,名字取材于MATLAB,模仿MATLAB构建 基本使用: x和y的长度必须一致 figure()方法用来设置图片大小 x,y ...
- HTML accessKey约定俗成的标准
accessKey属性提供了键盘快捷键 例: <a href="index.html" accessKey="1">Home</a> 这 ...
- 思科设备ACL与NAT技术
ACL 访问控制列表(Access Control Lists),是应用在路由器(或三层交换机)接口上的指令列表,用来告诉路由器哪些数据可以接收,哪些数据是需要被拒绝的,ACL的定义是基于协议的,它适 ...
- 【sublime Text】关闭sublime的更新提醒和激活提醒
下载了原版的sublime Text,未激活的,每次启动都会提醒要去更新么?需要激活吧 ? 超级烦.[谁让没有激活呢?] 那没办法 ,激活吧! Help ---- Enter License--> ...
- Java 日志系统
Java 日志系统 1. 创建日志记录器 private final Logger logger = LoggerFactory.getLogger(LoggerTest.class); 2. 打印日 ...
- 怎样理解 DOCTYPE 声明
1. HTML 4.01 Strict <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www. ...
- C#中word文档转html
var path = Request.Url.Host + ":" + Request.Url.Port + list[i].AnnexPath; //html保存路径 strin ...
- asp.net 7.分页
分页 SQL: select * from( select *,row_number()over(order by id) as num from T_userInfo) as t 数据层(UserI ...