删除照片后刷新页面答案

【问题标题】：Refresh page after delete photo删除照片后刷新页面
【发布时间】：2017-05-03 03:30:30
【问题描述】：

您好，我在 javascript 中有功能，可以从数据库和服务器中删除照片。它工作正常，我删除了照片，但这张照片仍在我的浏览器中。我有问题。如何仅在 javascript 端刷新？

 container.addEventListener("click", function(e){
                if(e.target.tagName == 'BUTTON'){
                     var id = e.target.dataset.type;
                   var r = confirm("Are You sure to delete?");
if (r == true) {
    $.ajax({
        type: 'POST',
        url: 'index.php?r=gallery/deletep&name='+id,
        dataType: 'html'
    });
} 
                }
    });

现在我很想添加

location.reload();

在 ajax 之后，但我不想刷新所有页面。如何从浏览器中动态删除？

【问题讨论】：

在AJAX的回调中。
但我仍然必须使用 location.reload()？此功能会重新加载我想做的所有页面，例如仅通过浏览端刷新
不，当 AJAX 完成并执行其成功回调时，您可以从回调函数中删除任何附加到 DOM 的元素。

标签： javascript ajax refresh reload

【解决方案1】：

好的，在这种情况下，您有两种选择。您可以使用 AJAX 请求加载内容，也可以使用该元素的类或 id 从 DOM 中删除该元素。因此，如果您使用 AJAX 加载了内容，您可以在成功删除图像后再次加载所有这些内容。

$.ajax({ type: 'POST', url: 'index.php?r=gallery/deletep&name='+id, dataType: 'html', success: function(response) { $(e.target).remove(); } });

或，

$.ajax({ type: 'POST', url: 'index.php?r=gallery/deletep&name='+id, dataType: 'html', success: function(response) { // use next ajax query to load content on DOM } });

【讨论】：

【解决方案2】：

您无需重新加载整个页面即可删除图像。在 AJAX 调用的成功回调中使用来自 jQuery 的 remove() API。

   $.ajax({
    type: 'POST',
    url: 'index.php?r=gallery/deletep&name='+id,
    dataType: 'html',
    success: function(response){
       $('img#id').remove();
    }
});

【讨论】：