Question

我正在尝试删除li元素，该元素是所点击的a元素的父元素。

这是我的代码：

function vanish(id_arg){
        $.ajax({
            url: "/vanish/",
            type: "POST",
            data: {id_to_delete: id_arg},
        }).success(function(data){
           document.getElementsByTagName('li').getElementById(id_arg).remove();
        });
    }

这是我的HTML：

{% for i in p %}
<li id="{{i.id}}"> <a>{{i.name}}</a><a onclick="vanish({{i.id}})" class="item">delete</a></li>    
{% endfor %}

p是包含name和id的查询响应。

vanish()将从数据库中删除该项目，并作为ajax响应我也想从页面中删除该项目。我需要删除而不是隐藏。

我的问题是它没有从页面中删除，我试图用{j}和li来抓住remove()，但却找不到合适的代码。

Answer 1

首先找到孩子并从文档正文中删除。

          var child = document.getElementById(id_arg);
          document.body.removeChild(child);

Answer 2

下面将选择所有链接并删除其上方的父元素。如果您在页面上有其他链接，我建议您可以为该链接指定一个类，以便您可以指定要删除的链接。另请注意，在li上调用remove（）也会删除元素内的所有内容。

$('#' + id_arg).click(function(){
    $(this).parent().remove();
});

编辑：快速阅读问题，你可以在你的ajax调用的成功函数中包含这个：

$('#' + id_arg).closest('li').remove();

如何删除ajax响应函数中的li元素

2 个答案: