jQuery获取选中Checkbox属性并拼接为逗号分隔字符串

jQuery获取选中Checkbox属性并拼接为逗号分隔字符串

本文分享一种利用jQuery实现的功能：提取所有被选中的复选框（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>

jQuery脚本部分：为每个复选框绑定点击事件，在事件处理函数中遍历所有当前处于选中状态的复选框。

$(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);
    });
});

希望上述代码示例能对您的jQuery开发工作提供有益帮助。