Question

当image和div标签都是段落的子项时，$("img").next().hide();似乎不起作用。

<p>
<img src="image.jpg" />
<div>text</div> // this div is set to 'display: none' by default in css
</p>

然而，如果我用<div>替换<span>

<p>
<img src="image.jpg" />
<span>text</span>
</p>

或者如果我省略<p>标签

<img src="image.jpg" />
<div>text</div>

jQuery选择器可以正常工作。任何想法为什么会这样？它与内联和块显示有关吗？如何使其工作如顶部代码示例中所述？

这是我正在使用的jQuery代码：

$(document).ready(function(){
    $("img").hover(
        function()
        {
            $(this).next().show();
        },
        function()
        {
            $(this).next().hide();
        }
    );
});

感谢您的帮助！

Answer 1

您不应在内联元素（P）中使用块元素（DIV）。而不是P使用DIV，类设置为P。

Answer 2

p element仅允许inline-level elements作为子元素。这可能是您的第一个示例无效的原因。

jQuery层次结构问题与next（）

2 个答案: