在前端开发中，我们经常需要处理一组复选框的集合。有时候，我们需要将其中特定name的复选框勾选，并将对应的值进行显示。这篇文章介绍了如何使用JQuery来实现这个功能。
HTML代码
首先，我们需要创建一个包含多个name为"myCheckbox"的复选框的HTML表单。这里我们创建一个包含5个复选框的表单：
<form> <input type="checkbox" name="myCheckbox" value="1"> Checkbox 1<br> <input type="checkbox" name="myCheckbox" value="2"> Checkbox 2<br> <input type="checkbox" name="myCheckbox" value="3"> Checkbox 3<br> <input type="checkbox" name="myCheckbox" value="4"> Checkbox 4<br> <input type="checkbox" name="myCheckbox" value="5"> Checkbox 5<br> </form>
JQuery代码
接下来，我们使用JQuery来获取所有name为"myCheckbox"的复选框集合，并根据用户选择的项来显示所选项的值。
-- -------------------- ---- -------
---------------------------- -
-- -------------------------
--- ---------- - ----------------------------
-- --------------
--------------------------- -
-- --------------------
--- -------------- - ---
-- -------
-------------------------- -
-- --------------------------------
-- ------------------------ -
-----------------------------------
-
---
-- ---------------
---------------------------------------- ----
---
---在这段代码中，我们首先使用JQuery选择器来获取所有name为"myCheckbox"的复选框，并将它们存储在一个变量中。然后，我们给每个复选框添加一个点击事件处理函数。
在事件处理函数中，我们遍历所有复选框，并将已选中的复选框的值存储在一个数组中。最后，我们将所选项的值以逗号分隔的形式显示在页面上。
示例
你可以在以下链接中找到完整的示例代码：https://codepen.io/chatgpt/pen/yLmYrVb
在本示例中，当用户勾选一些复选框时，所选项的值会在输出框中动态更新。这样，我们就可以很容易地实现一个功能强大且易于使用的复选框集合。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/3035