jQuery

Question

这有点难以解释，但这里没什么：

我有 .wrapper，其中包含 50 个没有点击事件的元素。

在另一个地方我随机加载了 50 个元素中的 5 个。

现在我要做的是查看出现了哪 5 个随机元素，这样我就可以将它们变成 .wrapper.

中的点击对象

例如，这是包含以下元素的包装器：

<div class="wrapper">
  <div class="object1"></div>
  <div class="object2"></div>
  <div class="object3"></div>
  <div class="object4"></div>
  <div class="object5"></div>
  <div class="object6"></div>
  <div class="object7"></div>
  <div class="object8"></div>
  <div class="object9"></div>
  <div class="object10"></div>
  <!-- and so on -->
</div>

这是随机容器：

<div class="random">
  <div class="object7"></div>
  <div class="object9"></div>
  <div class="object5"></div>
  <div class="object6"></div>
  <div class="object1"></div>
</div>

我已经试过了，它确实有效，但它只适用于我调用的第一个，此外，必须有更好的方法。

if ($('.random div').hasClass(".object1")){
  $(".wrapper .objects1").on("click", function() {
    // do things
  });
}

if ($('.random div').hasClass(".object2")){
  $(".wrapper .objects2").on("click", function() {
    // do things
  });
}

if ($('.random div').hasClass(".object3")){
  $(".wrapper .objects3").on("click", function() {
    // do things
  });
}

// and so on (until 50...)

Answer 1

对象真的需要在单独的 class 中吗？如果结构如下所示：

<div class="wrapper">
  <div class="object" id = "obj1"></div>
  <div class="object" id = "obj2"></div>
  <div class="object" id = "obj3"></div>
  <!-- and so on -->
</div>

然后你可以在随机 div 中用 class "object" 遍历每个 div 像这样：

$('.random div').children(".object").each(function(i, obj) {
    //do things with each object
    //i is the index in the array of children with class object
    //obj is current object in the list

});

Answer 2

您可以 select 所有随机 div，然后将它们 class 和 select 的 div 放入包装器中。创建一个包含点击处理程序的映射对象。您可以通过传递 class 来获取特定的点击处理程序。

如果它们是唯一的，您应该使用 id。

var clickHandlers = {
    object7: function(e) {
        // do things for 7
    },
    object8: function(e) {
        // do things for 8
    },
    ...
};

var randomDivs = $('.random div');
$.each(randomDivs, function(index, randomDiv) {  
  var divClass = randomDiv.className;
  var wrapperDiv = $('.wrapper .'+divClass);
  wrapperDiv.on('click', clickHandlers[divClass]);
});

jQuery - 如果 hasClass 但对于多个元素

jQuery - If hasClass but for multiple elements

random

elements