我在一个页面上有多个 HTML 元素
<a href='#' class='note-links'>
<div class='notes'>
<div class='course_title'><b>{$course_title}</b></div>
<img src='images/download_file.jpg' class='file' />
<div class='course_code'>{$course_code}</div>
<div class='level'>{$course_level} Level</div>
<div class='price' class='notice'>₦ {$price}</div>
<div class='opt'><br />
<a href='' class='edit' id='{$id}'>Edit</a> .
<a href='' class='delete' id='{$id}'>Delete</a>
</div>
</div>
</a>
class opt 的div 被隐藏。
我想悬停 anchor 标记以使隐藏的 div 仅对悬停的 anchor 标记可见。
我使用了下面的 jQuery 代码
$('#menu-display').on('hover', '.note-links', function() {
$(this).find('.opt').css('visibility', 'visible');
});
当我将鼠标悬停在 anchor 标记上时，什么也没有显示。但是，如果我删除 .find()，隐藏的 div 会显示，但对于所有其他未悬停的 anchor 标记。
为什么会发生这种情况，我该如何解决？
最佳答案
CSS
.opt {visibility : hidden}
#menu-display .note-links:hover .opt {visibility : visible}
为此您不需要 jQuery，但是您不能用另一个 anchor 包裹一个 anchor ?
关于Jquery .find() 在这种情况下不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16703207/