Question

我有div这样：

<div id="content">
    <div id="link1">
        <a href="#"><img src="pic1.png"></a>
    </div>
    <div id="link2">
        <a href="#"><img src="pic2.png"></a>
    </div>
</div>

隐藏了一个标签，所以我希望通过悬停link1或link2来展示它我已经做到了这么远但它没有工作

$("#content a").hide();
$("#content div").hover(function(){
    var id = (this.id);
    $('#' + id + 'a').show();
});

Answer 1

您需要更新

 $('#' + id + 'a').show();

到

 $('#' + id + ' a').show();

Answer 2

您的选择器需要在id和a之间留出空格，以便您明确表示您正在尝试定位后代元素。

$("#content div").hover(function(){
    var id = this.id;
    $('#' + id + ' a').show();
});

也就是说，您已经引用了this，因此在字符串中构建选择器是多余的，请使用find()：

$("#content div").hover(function(){
    $(this).find('a').show();
});

什么是正确的jquery选择器

2 个答案: