使用jQuery获取radio/checkbox组的值的代码收集
<!--
$("document").ready(function(){
$("#btn1").click(function(){
$("[name='checkbox']").attr("checked",'true');//全选
})
$("#btn2").click(function(){
$("[name='checkbox']").removeAttr("checked");//取消全选
})
$("#btn3").click(function(){
$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数
})
$("#btn4").click(function(){
$("[name='checkbox']").each(function(){//反选
if($(this).attr("checked")){
$(this).removeAttr("checked");
}
else{
$(this).attr("checked",'true');
}
})
})
$("#btn5").click(function(){//输出选中的值
var str="";
$("[name='checkbox'][checked]").each(function(){
str+=$(this).val()+"\r\n";
//alert($(this).val());
})
alert(str);
})
})
-->
其中
详细出处参考：http://www.jb51.net/article/21581.htm
$("[name='checkbox'][checked]").each(function(){
str+=$(this).val()+"\r\n"; //alert($(this).val());
})
这部分代码在FireFox无法正常工作，在网上查找后，发现了一个方法才可以正常使用，如下所示：
$("[name='checkbox']:checked").each(function(){
str+=$(this).val()+"\r\n"; //alert($(this).val());
})
jQuery中取得checkbox组中被选中的值
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>louis-blog >> jQuery 对checkbox的操作</title>
<script type='text/javascript' src="http://img.jb51.net/jslib/jquery/jquery.js"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
$("document").ready(function(){
$("#btn1").click(function(){
$("[name='checkbox']").attr("checked",'true');//全选
})
$("#btn2").click(function(){
$("[name='checkbox']").removeAttr("checked");//取消全选
})
$("#btn3").click(function(){
$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数
})
$("#btn4").click(function(){
$("[name='checkbox']").each(function(){//反选
if($(this).attr("checked")){
$(this).removeAttr("checked");
}
else{
$(this).attr("checked",'true');
}
})
})
$("#btn5").click(function(){//输出选中的值
var str="";
$("[name='checkbox'][checked]").each(function(){
str+=$(this).val()+"\r\n";
//alert($(this).val());
})
alert(str);
})
})
-->
</SCRIPT>
</HEAD>
<body style="text-align:center;margin: 0 auto;font-size: 12px;">
<div style="border: 1px solid #999; width: 500px; padding: 15px; background: #eee; margin-top: 150px;">
<form name="form1" method="post" action="">
<input type="button" id="btn1" value="全选">
<input type="button" id="btn2" value="取消全选">
<input type="button" id="btn3" value="选中所有奇数">
<input type="button" id="btn4" value="反选">
<input type="button" id="btn5" value="获得选中的所有值">
<br><br>
<input type="checkbox" name="checkbox" value="checkbox1">
checkbox1
<input type="checkbox" name="checkbox" value="checkbox2">
checkbox2
<input type="checkbox" name="checkbox" value="checkbox3">
checkbox3
<input type="checkbox" name="checkbox" value="checkbox4">
checkbox4
<input type="checkbox" name="checkbox" value="checkbox5">
checkbox5
<input type="checkbox" name="checkbox" value="checkbox6">
checkbox6
</form>
</div>
</body>
</HTML>
使用jQuery获取radio/checkbox组的值的代码收集的更多相关文章
- jQuery获取Radio选择的Value值||两个select之间option的互相添加操作(jquery实现)
jQuery获取Radio选择的Value值: 1. $("input[name='radio_name'][checked]").val(); //选择被选中Radio的Val ...
- jquery获取radio和select选中值
//jquery 获取radio选中值 <input type="radio" name="c_type" value="a" > ...
- jquery 获取radio被选中的值
<html> <head> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"& ...
- jQuery获取radio选中项的值【转藏】
<title></title> <script src="js/jquery-1.7.2.min.js"></script> < ...
- jquery获取radio单选框的值
1.获取原有单选框的值 var value=$("input[name='is_setting']:checked").val(); 2.获取重选后的单选框的值 <tr> ...
- 使用jquery获取radio的值
使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: ...
- jquery获取radio选中值及遍历
使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项:1.& ...
- js与jquery获取input输入框中的值
如何用javascript获取input输入框中的值,js/jq通过name.id.class获取input输入框中的value 先准备一段 HTML 一.jquery获取input文本框中的值 通过 ...
- 如何用jquery获取页面下HiddenField的值··
怎么用jquery获取页面上HiddenField的值·· 怎么用jquery获取页面上HiddenField的值··?HiddenField的值是从后台赋值的··· 先赋值给Hiddenfield ...
随机推荐
- 【BZOJ 4569】 4569: [Scoi2016]萌萌哒 （倍增+并查集）
4569: [Scoi2016]萌萌哒 Time Limit: 10 Sec Memory Limit: 256 MBSubmit: 865 Solved: 414 Description 一个长 ...
- UVA.11427.Expect the Expected(期望)
题目链接 \(Description\) https://blog.csdn.net/Yukizzz/article/details/52084528 \(Solution\) 首先每一天之间是独立的 ...
- BZOJ.2716.[Violet3]天使玩偶(CDQ分治 坐标变换)
题目链接 考虑对于两个点a,b,距离为|x[a]-x[b]|+|y[a]-y[b]|,如果a在b的右上,那我们可以把绝对值去掉,即x[a]+y[a]-(x[b]+y[b]). 即我们要求满足x[b]& ...
- C++ 队列（queue）堆栈（stack）实现基础
Queue 在C++中只要#include<queue>即可使用队列类,其中在面试或笔试中常用的成员函数如下(按照最常用到不常用的顺序) 1. push 2. pop 3. size 4. ...
- bzoj1503 郁闷的出纳员
Description OIER公司是一家大型专业化软件公司,有着数以万计的员工.作为一名出纳员,我的任务之一便是统计每位员工的 工资.这本来是一份不错的工作,但是令人郁闷的是,我们的老板反复无常,经 ...
- UVALive 6912 Prime Switch 状压DP
Prime Switch 题目连接: https://icpcarchive.ecs.baylor.edu/index.php?option=com_onlinejudge&Itemid=8& ...
- SGU 200. Cracking RSA （高斯消元求自由变元个数）
题目链接:http://acm.sgu.ru/problem.php?contest=0&problem=200 200. Cracking RSA time limit per test: ...
- mui选择器和dom获取元素的区别（记得把mui对象转为dom对象才能调用用dom方法）
<!DOCTYPE html><html> <head><meta charset="UTF-8"><meta name=&q ...
- 【Go命令教程】3. go install
命令 go install 用于编译并安装指定的代码包及它们的依赖包.当指定的代码包的依赖包还没有被编译和安装时,该命令会先去处理依赖包.与 go build 命令一样,传给 go install 命 ...
- 华为正在力挺的NB-IoT是什么鬼！ - 全文
NB-IoT,Niubility Internet of Thing,即牛掰的物联网技术. 关于物联网,小编想从2款很有趣的应用说起. 这不是在播限制级.这是Nake Labs推出的3D健身镜,这款智 ...