jQuery将所有被选中的checkbox某个属性值连接成字符串的方法
更新时间：2015年01月24日 10:24:39 投稿：shichen2014
这篇文章主要介绍了jQuery将所有被选中的checkbox某个属性值连接成字符串的方法,可实现将选中属性值连接成字符串的功能,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了jQuery将所有被选中的checkbox某个属性值连接成字符串的方法。分享给大家供大家参考。具体如下：
需求：
对于一组checkbox，当点击每个checkbox后，把当前处于选中状态的checkbox的某个属性值取出来连接成字符串，并以逗号分开。
实现方法：
html部分：
复制代码 代码如下:
<input type="checkbox" id="1"/>
<label for="1">选项一</label>
<br/>
<input type="checkbox" id="2"/>
<label for="2">选项二</label>
<br />
<input type="checkbox" id="3"/>
<label for="3">选项三</label>
<br/>
<span id="result"></span>
<label for="1">选项一</label>
<br/>
<input type="checkbox" id="2"/>
<label for="2">选项二</label>
<br />
<input type="checkbox" id="3"/>
<label for="3">选项三</label>
<br/>
<span id="result"></span>
jQuery部分，给每个checkbox定义点击事件，遍历所有选中的checkbox。
复制代码 代码如下:
$(function() {
$("input[type=checkbox]").on("click", function () {
var vIds = "";
$("input:checked").each(function() {
vIds += $(this).attr('id') + ",";
});
if (vIds.length > 0) {
vIds = vIds.substring(0, vIds.length - 1);
}
$('#result').text(vIds);
});
});
$("input[type=checkbox]").on("click", function () {
var vIds = "";
$("input:checked").each(function() {
vIds += $(this).attr('id') + ",";
});
if (vIds.length > 0) {
vIds = vIds.substring(0, vIds.length - 1);
}
$('#result').text(vIds);
});
});
希望本文所述对大家的jQuery程序设计有所帮助。
相关文章
这篇文章主要介绍了jQuery选择器特殊字符与属性空格问题。通过选择器中含有特殊符号的注意事项和选择器中含有空格的注意事项详细介绍了解决问题的办法,需要的朋友可以参考下2017-08-08
最近接到新需求，需要实现一个点击发送验证码之后，按钮禁用，在5秒之后取消禁用，看似需求很简单，实现起来还真的好好动动脑筋，下面小编把jquery控制按钮禁用核心代码分享给大家，需要的朋友参考下吧2021-07-07
本文写给那些完全不懂JS，只会一些HTML和CSS的同学！本站就是范例2009-11-11
本文主要介绍了jQuery实现图片滑动效果的实例，具有很好的参考价值。下面跟着小编一起来看下吧2017-03-03
在本篇内容里小编给大家分享了jQuery获取特殊属性的值以及设置内容相关知识点，有需要的朋友们参考下。2018-11-11
这篇文章主要介绍了jquery Form轻松实现文件上传的相关过程，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-05-05
jQuery之$(document).ready()使用介绍
学习jQuery的第一件事是：如果你想要一个事件运行在你的页面上，你必须在$(document).ready()里调用这个事件2012-04-04
ASP.NET jQuery 实例7 通过jQuery来获取DropDownList的Text/Value属性值
这节我们将通过jQuery来获取DropDownList的Text/Value属性值,需要的朋友可以参考下2012-02-02
这篇文章主要介绍了validform表单验证的实现方法，validform插件主要把所有的验证条件和验证提示信息绑定到每个表单元素，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-03-03
下面小编就为大家带来一篇jQuery根据ID、CLASS、等获取对象的实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-12-12
最新评论