Question

我想以委托事件的方式处理2个元素：

$("#pagination_container").on("click", ".image-container", function() {
     var c = $("#article_"+$(this).attr("data-pk"));
     var q = $("#qtecmd_"+$(this).attr("data-pk"));
     if (c.is(":checked")) {
         c.prop("checked", false);
         q.hide();
     }
     else {
         c.prop("checked", true);
         q.show();
     }
});

$("#pagination_container").on("click", "label", function() {
     var c = $("#article_"+$(this).attr("data-pk"));
     var q = $("#qtecmd_"+$(this).attr("data-pk"));
     if (c.is(":checked")) {
         c.prop("checked", false);
         q.hide();
     }
     else {
         c.prop("checked", true);
         q.show();
     }
});

你可以看到他们做同样的事情。那么是否可以将这两个处理程序组合成一个独特的处理程序来同时选择".image-container"和"label"？

Answer 1

您可以将任何有效的选择器传递给on()，因此您只需传递一个multiple-selector来选择目标元素，例如

$("#pagination_container").on("click", ".image-container, label", function() {
     var c = $("#article_"+$(this).attr("data-pk"));
     var q = $("#qtecmd_"+$(this).attr("data-pk"));
     if (c.is(":checked")) {
         c.prop("checked", false);
         q.hide();
     }
     else {
         c.prop("checked", true);
         q.show();
     }
});

Answer 2

您可以通过逗号分隔它来完成此操作。看看：

$("#pagination_container").on("click", ".image-container,label", function() {
  //your js code
});

Answer 3

以逗号分隔

$("#pagination_container").on("click", ".image-container, label", function() {

委托事件：许多元素的选择器

3 个答案: