使用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 ...
随机推荐
- Qt界面UI之QML初见(学习笔记四)
拖了大半年,今天终于有更新了...我自己都不好意思,最近太忙了! 今天讲一下:QML语法 一 概述 QML是一种专门用于构建用户界面的编程语言,它允许用户构建高性能,具有流畅特效的可视化应用程序,QM ...
- SpringMVC(八) RequestMapping HiddenHttpMethodFilter
SpringMVC隐藏方法: 使用PUT和DELETE方法.默认HTML支持GET和POST方法.通过HiddenHttpMethodFilter将POST转成PUT和DELETE方法. 1.将Hid ...
- 解决apache上访问 cgi脚本时总是在网页中显示出脚本的源代码而不是执行结果的问题
apache是支持cgi脚本的,但是需要保证四个条件: 1.放置cgi脚本的文件夹本身需要对apache服务器这个用户(一般默认用户名是www,linux下的用户机制请自行百度)开放x(即可执行)权限 ...
- openQPA[01]初次认识与使用
开源项目QPA 1.项目主页:[http://protocol.sinaapp.com/] 2.项目介绍: 3.运行项目: (1)安装python2.7,并安装PyQt4. 下载地址[https: ...
- Codeforces.314E.Sereja and Squares(DP)
题目链接 http://www.cnblogs.com/TheRoadToTheGold/p/8443668.html \(Description\) 给你一个擦去了部分左括号和全部右括号的括号序列, ...
- Yarn使用简介
Yarn是由Facebook.Google.Exponent 和 Tilde 联合推出了一个新的 JS 包管理工具 , 它主要是为了弥补 npm 的一些缺陷而出现的.和npm相比,它具有如下特点: 速 ...
- Booting dircetly into Redlink FW from flash
Booting dircetly into Redlink FW from flash Hello, the usual way to use the Redlink FW is a two-step ...
- 使用cwRsync实现windows下文件定时同步
1.参考文献: 使用cwRsync实现windows下文件定时同步(备份) 文件同步工具CwRsync的使用方法及常用命令详解 2.背景: 当前的SCADA架构中,有1台Server,5台FE,还有1 ...
- SQL 中的语法顺序与执行顺序(转)
很多程序员都很抵触SQL.其实SQL是一整为数不多的声明性语言,只是它的运行方式完全不同于我们所熟知的命令行语言.面向对象的程序语言.甚至是函数语言. 今天大家共同学习下SQL的语法顺序与执行顺序.( ...
- 禁止浏览器backspace键(退格键)时跳转页面(extjs,javascript)
Ext实现方式: //方法一 var key = new Ext.KeyMap(document,{ key: 8, fn: function(obj,e){ var type = e ...