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中选中的值,并根据需要执行其他操作。