淘先锋技术网

首页 1 2 3 4 5 6 7

jQuery是一种流行的JavaScript库,用于简化Web开发。其中包括许多有用的函数,可用于操作DOM元素,包括复选框列表。在本文中,我们将学习如何使用jQuery CheckBoxList获取选中值。

// HTML代码
<ul id="myCheckboxList">
<li><input type="checkbox" value="apple" > Apple</li>
<li><input type="checkbox" value="orange" > Orange</li>
<li><input type="checkbox" value="banana" > Banana</li>
</ul>
// jQuery代码
$(document).ready(function() {
//获取CheckBoxList元素
var checkBoxList = $("#myCheckboxList input[type='checkbox']");
//为每个复选框添加点击事件
checkBoxList.click(function() {
//获取所有选中复选框的值
var selectedValues = checkBoxList.filter(':checked').map(function() {
return this.value;
}).get();
//在控制台打印选中值
console.log(selectedValues);
});
});

上面的代码中,我们首先使用$()函数获取id为myCheckboxList的ul元素下的所有复选框元素。接下来,我们为每个复选框添加click事件,当点击时获取所有选中的复选框的值,并将其打印到控制台中。

当我们运行上面的代码并选中几个复选框时,我们将在浏览器控制台中看到所选值的数组。这样,我们就可以轻松地获取CheckBoxList中选中的值,并根据需要执行其他操作。