使用 ajax 刷新 div，我的 div 没有刷新

Question

在使用 ajax 删除了一些数据后，我想刷新我的 div。我正在使用 Laravel 5.4 。我是 laravel 的初学者。请帮我解决这个问题。

这是我刷新的代码 div :

var url = window.location.href;
function RefreshDiv() {
    $(".uploaded-images").fadeOut();
    $(".uploaded-images").load(url+" .uploaded-images", function() {
      $(".uploaded-images").fadeIn();
    });
}

当我执行 RefreshDiv 函数时，它只会让我的 div 变空，但是当我按 f5 刷新我的页面时，它成功地删除了我的数据。我唯一的问题是我的 RefreshDiv 我不想刷新我的 div 但它给了我空 div.

这是我执行得很好的删除函数：

function deleteImage(product_img_id) {
  $.ajax({
    url: "{{ url('admin/del-img') }}/" +product_img_id,
    type: "GET",
    dataType: "JSON",
    success: function(data) {
      RefreshDiv();
    }
  });
}

这是我要刷新的 div：

<div class="row" style="margin-top: 20px;">
          <h5>Uploaded Images</h5>
          <div class="uploaded-images">
          </div>
</div>

在我上传的图片 div 中，是我的另一个 ajax.

的委托函数

这是我的委托函数：

function getProductDetails(product_id) {
    $( ".uploaded-images" ).empty();
    $.ajax({         
        url: "{{ url('admin/get-product') }}/" +product_id,        
        type: "GET",
        dataType: "JSON",
        success: function(data) {
for(var i=1;i<data.product_images.length;i++) {
                 $(".uploaded-images").append('<div class="img-wrap">'+'<span class="close">&times;</span>'+'<img src="'+"{{ asset('image_files') }}/"+data.product_images[i].product_image+'" data-id="'+data.product_images[i].product_img_id+'" style="max-height:50px; max-width:90px;">'+'</div>');
            };   
        }
    }); 
}

Answer 1

试试这个：

function deleteImage(product_img_id) {
  $.ajax({
   url: "{{ url('admin/del-img') }}/" +product_img_id,
   type: "GET",
   dataType: "JSON",
   success: function(data) {
    RefreshDiv(product_img_id);
   }
 });
}

var url = window.location.href;
function RefreshDiv(product_img_id) {
   $(".uploaded-images img[data-id="+product_img_id+"]").parent().remove();
   $(".uploaded-images").load(url+" .uploaded-images", function() {
   $(".uploaded-images").fadeIn();
 });
}

Answer 2

为什么要刷新 div...如果要删除图像，为什么不直接从 DOM 中删除成功的元素？

试试这个：

function RefreshDiv(product_img_id) {
   $("img[data-id="+product_img_id+"]").closest('.img-wrap').remove();
}

使用 ajax 刷新 div，我的 div 没有刷新

refreshing a div using ajax, my div didn't refresh

javascript

ajax

jquery

partial-page-refresh