jquery 局部刷新load 某個div或者某個表格

在使用 ajax 進行刪除用戶操作的時候，可以在 success 里寫一個 window.location.reload(); 讓頁面刷新。 但是，我不想那樣，我只想局部刷新

 

比如，我刪除幾個用戶后，頁面只會刷新上面的表格，該怎么做呢？  

傳統的做法

傳統的純 js 做法可以使用 var content = document.getElementById("content"); content.innerHTML("一大坨HTML代碼") 就是重新繪制那部分DIV，當然往往我們的需要寫很多標簽，很不爽。 而如果我們使用 jQuery 的 load 方法就可以幫我們獲得那一大坨HTML代碼了  

jQuery的load()方法

HTML

<div id="content">
          <div class="table-responsive">
               <!-- do something-->
           </div>
</div>

  JavaScript

$.ajax({
    async: false,
    type: "POST",
    url: '/admin/user/deleteMore',
    data: {"ids": str},
    dataType: "json",
    success: function () { },
    error: function () { },
    complete: function () {
        $("#content").load("http://localhost:8090/admin/user/list .table-responsive");
        //window.location.reload();
    }
})

  load方法使用很簡單 $("#id").load("param") 這個 param 可以直接指定某個 url ，必須在是本服務器可以請求的頁面哦 如 http://localhost:8090/admin/user/add 也可以填 div 如 http://localhost:8090/admin/user/add #main   注意一點是，我上面的例子中，是用 #content 來"包裹"着 .table-responsive 的 所以 $("#content").load("http://localhost:8090/admin/user/list .table-responsive"); 的作用是 先通過ajax去請求 http://localhost:8090/admin/user/list .table-responsive 獲得里面的 HTML 內容 然后裝到 本頁面的 #content 中