jQuery：选择一个内的标签

Question

当选择删除按钮时，我尝试使用 jquery 淡出

中的

标记。

<ul>
    <li>
        <p>Here is some text!</p>
        <span class="delete">Delete</span>
    <li>
<ul>

到目前为止，这是我的 jQuery：

$(".delete").click(function(){
    //Needs to select the <p> tag within the same <li> 
    $("p").fadeOut(); 
});

Answer 1

使用引用的结构，简单地说：

$(".delete").click(function(){
    //Needs to select the <p> tag within the same <li> 
    $(this).prev("p").fadeOut(); 
});

如果 p 可能不是删除链接的直接前身，那么您可以这样做：

$(".delete").click(function(){
    //Needs to select the <p> tag within the same <li> 
    $(this).closest("li").find("p").fadeOut(); 
});

...这将淡出它在 li 中找到的所有 p 元素，或者这样：

$(".delete").click(function(){
    //Needs to select the <p> tag within the same <li> 
    $(this).closest("li").find("p").first().fadeOut(); 
});

...这将淡出第一个 它在 li 中找到的 p 元素，或者this:

$(".delete").click(function(){
    //Needs to select the <p> tag within the same <li> 
    $(this).prevAll("p").first().fadeOut(); 
});

...这将淡出它发现的从删除链接向后工作的第一个同级。

参考文献：

• prev - 查找紧邻上一个同级，或者如果与选择器不匹配则什么也不
• closest - 查找 匹配的最近祖先
• 与选择器find - 查找与选择器匹配的所有后代
• prevAll - 以相反的文档顺序查找与选择器匹配的所有先前同级元素（例如，从当前元素向后工作）
• <一href="http://api.jquery.com/first/" rel="nofollow">first - 只抓取当前集合中的第一个元素

Answer 2

$(".delete").click(function () {
    //Needs to select the <p> tag within the same <li> 
    $(this).closest("li").find("p").fadeOut(); 
});

...或者您使用 parent() 而不是 closest()。

如果

始终 位于 之前，您还可以执行以下操作：

$(".delete").click(function () {
    //Needs to select the <p> tag within the same <li> 
    $(this).prev("p").fadeOut(); 
});