这有点难以解释,但这里什么都没有:
我有 .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...)
答案 0 :(得分:1)
对象真的需要在不同的类中吗?如果结构看起来像这样:
<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中用类“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
});
答案 1 :(得分:1)
您可以选择所有随机div,然后获取他们的类并选择包装器内的div。创建一个包含单击处理程序的映射对象。您可以通过传递类来获取特定的单击处理程序。
如果它们是唯一的,你应该使用相当的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]);
});