'toggleClass'不适用于所有其他div

Question

由于一些奇怪的原因，我添加的这个简单的点击功能，应该是将“大”类添加到点击的div，只适用于其他div。

See an example here（点击方框与图片）

$('.box').click(function(){ 

$(this).toggleClass('big').siblings().removeClass('big'); 

});  

这里是一个小提琴，但我选择不发布这个，因为它工作得很好，因为它应该做的。该错误是由其他一些因素引起的，但我不知道是什么 http://jsfiddle.net/Ly1bxswq/1/

Answer 1

您在循环中绑定你的click处理程序，但需要做的只有一次，当所有的元素添加到页面。

$.each(data.feed.entry, function (i, entry) { 
    // ... 
    $container.append(item); 
    // ... 
}) 

$('.box').click(function(){ 
    $(this).toggleClass('big').siblings().removeClass('big'); 
} 

正如指出的@Yan深色的评论，这将是更好地从各个.box事件委托给他们的父母。这样，你可以绑定你在任何时候（.box元素被添加到页面甚至更早）处理器

$container.on("click", ".box", function(){ 
    $(this).toggleClass('big').siblings().removeClass('big'); 
});