Javascript 需要使用jquery为两组不同的复选框设置单独的单击事件。

我有两套复选框。一个用于类别，一个用于产品

对于类别我有这个

<div id="category">
    <input type="checkbox" id="cateogry1">
    <input type="checkbox" id="cateogry2">
    <input type="checkbox" id="cateogry3">
</div>

<div id="product">
    <input type="checkbox" id="product1">
    <input type="checkbox" id="product2">
    <input type="checkbox" id="product3">
</div>

现在我想将类别和产品的点击事件分开

---

如何使用jquery实现这一点

您可以使用如下JQuery选择器：

$("#category input").click(categoryFunction);

$("#product input").click(productFunction);

就像这样：

$("#category input").click(categoryFunction);

$("#product input").click(productFunction);

发生的情况是，select first将选择限制为基于每个

div

的ID。因此，

input

部分的意思是“仅输入属于父ID的后代”

因为您只有复选框输入元素，所以不需要指定类型。但是，如果您确实使用了更多的输入类型，则可以添加额外的

：复选框部分来进一步限制选择器：

$("#category input:checkbox").click(categoryFunction);

，它甚至显示了如何为单击的复选框获取
id
。
使用包含
div
id:

产品：

$("#product input:checkbox").click(...

类别

$("#category input:checkbox").click(...

您可以保留循环，但在
输入上添加测试
父项：

if($(this).parent().attr('id') === "category") { ... }
else { ... }

你的意思是
$（“#产品输入：复选框”）。每个（函数（）{}）？@Coder\u不，你不需要在它们之间循环。这可能有点多余。不需要（您不需要
每个
），此方法将选择产品或类别下的每个类型复选框输入，并将指定的相关单击事件应用于它们。@Coder\u sLaY-也许您应该在此处阅读有关选择器的一些api文档：@TravisJ&MrCode，那么我们不需要
每个
。
单击
事件将注册所有相应产品和类别复选框的事件，您的意思是
$（“#类别输入：复选框”）。每个（函数（）{}）？这会循环所有类别复选框吗？@Coder\u sLaY：你不需要使用循环。可以使用JQuery选择器来考虑这一点，并将
单击事件应用于所有匹配的元素。试试看，它会的work@Coder_sLaY：查看我的编辑，我已经发布了一个JSFIDLE链接，您可以看到它正在工作