Jquery遍历checkbox获取选中项value值的方法


Posted in Javascript onFebruary 13, 2014

源码:

jQuery(function($){ 
$("input[name='key']:checkbox").click(function(){ 
var ids = ''; 
var flag = 0; 
$("#ids").attr("value",ids); 
$("input[name='key']:checkbox").each(function(){ 
if (true == $(this).attr("checked")) { 
ids += $(this).attr('value')+','; 
flag += 1; 
} 
}); 
if(0 < flag) { 
$("#ids").attr("value",ids); 
return true; 
}else { 
alert('请至少选择一项!'); 
return false; 
} 
}); 
});

本源码的功能:

获取name=‘key'的复选框的值,将选中项的 value 写到隐藏域 <input type="hidden" name="ids" id="ids" value="" /> 的表单中。

核心语句:

$("input[name='key']:checkbox").each(function(){ 
if (true == $(this).attr("checked")) { 
ids += $(this).attr('value')+','; 
} 
});

在HTML中,如果一个复选框被选中,对应的标记为 checked="checked"。 但如果用jquery alert($("#id").attr("checked")) 则会提示您是"true"而不是"checked",所以判断 if("checked"==$("#id").attr("checked")) 是错误的,应该如上面那样书写: if(true == $("#id").attr("checked"))
Javascript 相关文章推荐
根据邮箱的域名跳转到相应的登录页面的代码
Feb 27 Javascript
jquery+CSS实现的多级竖向展开树形TRee菜单效果
Aug 24 Javascript
jQuery实现模仿微博下拉滚动条加载数据效果
Dec 25 Javascript
Es6 写的文件import 起来解决方案详解
Dec 13 Javascript
jQuery操作复选框(CheckBox)的取值赋值实现代码
Jan 10 Javascript
angular2倒计时组件使用详解
Jan 12 Javascript
AngularJS页面传参的5种方式
Apr 01 Javascript
JavaScript中splice与slice的区别
May 09 Javascript
最新Javascript程序员面试试题和解题方法
Nov 23 Javascript
vue基础之data存储数据及v-for循环用法示例
Mar 08 Javascript
JQuery animate动画应用示例
May 14 jQuery
浅析Vue下的components模板使用及应用
Nov 27 Javascript
比较不错的JS/JQuery显示或隐藏文本的方法
Feb 13 #Javascript
jquery获取元素索引值index()示例
Feb 13 #Javascript
jquery获取tr并更改tr内容示例代码
Feb 13 #Javascript
使用javascript做的一个随机点名程序
Feb 13 #Javascript
javascript不同类型数据之间的运算的转换方法
Feb 13 #Javascript
js清理Word格式示例代码
Feb 13 #Javascript
Js与下拉列表处理问题解决
Feb 13 #Javascript
You might like
几个比较实用的JavaScript 测试及效验工具
2010/04/18 Javascript
基于jQuery的动态表格插件
2011/03/28 Javascript
同一页面多个商品倒计时JS 基于面向对象的javascript
2012/02/16 Javascript
JavaScript四种调用模式和this示例介绍
2014/01/02 Javascript
jquery重复提交请求的原因浅析
2014/05/23 Javascript
js键盘事件的keyCode
2014/07/29 Javascript
jQuery CSS()方法改变现有的CSS样式
2014/08/20 Javascript
JavaScript中document.forms[0]与getElementByName区别
2015/01/21 Javascript
纯javascript实现简单下拉刷新功能
2015/03/13 Javascript
纯js实现仿QQ邮箱弹出确认框
2015/04/29 Javascript
全面解析Bootstrap排版使用方法(文字样式)
2015/11/30 Javascript
基于Javascript实现弹出页面效果
2016/01/01 Javascript
JQuery为元素添加样式的实现方法
2016/07/20 Javascript
js判断一个字符串是以某个字符串开头的简单实例
2016/12/27 Javascript
解决nodejs中使用http请求返回值为html时乱码的问题
2017/02/18 NodeJs
基于BootStrap的前端分页带省略号和上下页效果
2017/05/18 Javascript
node基于async/await对mysql进行封装
2019/06/20 Javascript
解决使用layui对select append元素无效或者未及时更新的问题
2019/09/18 Javascript
在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法
2019/09/24 Javascript
Python中使用md5sum检查目录中相同文件代码分享
2015/02/02 Python
Python单元测试框架unittest简明使用实例
2015/04/13 Python
django模板语法学习之include示例详解
2017/12/17 Python
详解Python使用tensorflow入门指南
2018/02/09 Python
在pycharm中为项目导入anacodna环境的操作方法
2020/02/12 Python
关于python中导入文件到list的问题
2020/10/31 Python
python 三种方法实现对Excel表格的读写
2020/11/19 Python
Python中使用Selenium环境安装的方法步骤
2021/02/22 Python
Diamondback自行车:拥有你的冒险
2019/04/22 全球购物
T3官网:头发造型工具
2019/12/26 全球购物
员工安全生产责任书
2014/07/22 职场文书
亚布力滑雪场导游词
2015/02/09 职场文书
护理专业自荐信范文
2015/03/06 职场文书
入党转正介绍人意见
2015/06/03 职场文书
详解php中流行的rpc框架
2021/05/29 PHP
Python 实现Mac 屏幕截图详解
2021/10/05 Python
Nginx HTTP跳转至HTTPS
2022/05/15 Servers