Question

我认为这是一个非常简单的问题，但我无法处理它：我的jsp中有一个无序列表，其中包含一些列表项：

<li>
    <p class="text">Some text.</p>
    <table class="answer-details" style="width: 100%">
    <tbody>
        <tr class="tr">
            <td style="width: 50%;">
                <div class="msg-modification" display="inline" align="right">
                    <a id="modify" class="delete-answer" href="#">Delete</a>
                </div>
            </td>
            <td style="width: 50%; vertical-align: bottom;">
                <img src="...">
                <a class="answer-author" href="..." target="_blank">User name</a>
                <div class="answer-info">29/06/2011</div>
            </td>
        </tr>                               
    </tbody>
</table>

如您所见，每个列表项都有一个删除消息/答案的链接。我正在尝试做的是，使用jQuery，当我点击链接时将信息消息显示在同一个li中，并将所有内容删除到除该消息之外的列表项中。

这是我的jQuery代码：

$('.esborrar-resposta').click(function(event) {
    event.preventDefault();

    $(this).closest('.li').children('p').remove(); // it doesn't work
    $(this).closest('.tr').before('<tr><td><div class="output">Information message</div></td></tr>');
    $(this).closest('.tr').remove();
});

以上代码删除除了段落标记以外的所有代码。这是我得到的HTML代码：

<li>
    <p>Some text.</p>
    <table class="answer-details" style="width: 100%">
            <tbody>
                    <tr><td><div class="output">Information message</div></td></tr>                             
            </tbody>
    </table>
</li>

我想删除这个段落标签，但我没试过这些选项：

$(this).closest('.li').children('p').remove();

和

$(this).closest('.text').remove()

（也许它不起作用，因为段落标记不是链接标记的父级）

有人可以帮我删除吗？

Answer 1

试

$("li")

而不是

$(".li")


$(this).closest('li').children('p').remove();

因为. li（前导点）表示您正在搜索class="li"，而不是<li>本身

Answer 2

li不是班级$(this).closest('.li').children('p').remove();

使用$(this).closest('li').children('p').remove();

Answer 3

简单：

$(this).closest('.li').children('p').remove();

搜索具有类li的元素，而不是<li>元素。替换为：

$(this).closest('li').children('p').remove();`

$(this).closest('.text').remove()

无效，因为.closest()执行以下操作：

从第一个开始，获取与选择器匹配的第一个祖先元素 当前元素并通过DOM树继续前进。（我的重点）

p.text元素不是祖先，而是祖先的兄弟。因此，以下可能有效：

$(this).closest('li').find('.text').remove();

使用jQuery删除具体元素

3 个答案: