网格，点击隐藏其他 div 的 html 内容

Question

我有一个在悬停时显示一些信息的网格。

点击后，我的列表内容出现了，其他内容淡出 div。

我遇到的问题是单击我的列表之一时，悬停出现在所有其他列表项中...none 应该出现这些悬停信息。

这是我正在使用的jQuery：

$('ul.thumbs li').on('click', function(){
    $('ul.thumbs li').find('.description').css('opacity',0);
    $('ul.thumbs li').not(this).find('.description').css('opacity',1);
});

为了更好地理解，请找到我的codepen：

http://codepen.io/anon/pen/rxBmYa

您会看到，单击一个缩略图时，悬停效果会停留在另一个缩略图上。

如果有人有任何解决方案，那就太棒了:)

Answer 1

您使用 not 选择器的方式有误。请参考文档here。对于您的用例，您可以将前三行替换为以下内容：

$('ul.thumbs li').on('click', function(e){
   $('ul.thumbs li').find('.description').css('opacity',0);
   $(e.target).css('opacity',1);
});

在这种情况下，e 是作为参数传递的点击事件，e.target 给出注册该事件的目标元素。

工作笔是here