在Ajax或jQuery調用後更新HTML

我創建了兩個調用，一個是調用我的控制器的ajax，另一個是jquery調用。我只是爲了檢查我的HTML是否會在觸發事件後更新......但是這些方法都沒有更新我的HTML（它保持相同的方式）。下面是方法：在Ajax或jQuery調用後更新HTML

方法1：

$("#btnSearch").click(function(){ 
     var startDate = $.trim($("#startDate").val()); 
     var endDate = $.trim($("#endDate").val()); 
     $.post("/history/list",{'startDate':startDate,"endDate":endDate},function(data){ 
      var result = $('<div />').append(data).find('#historyList').html(); 
      $('#historyList').append(result); 
      console.log(result); 
// the result is displayed correctly in the console... 
     }); 
    }); 
// This is supposed to update my HTML in the browser now, but it's not showing anything new...

方法2：一旦通話結束並返回數據

$('#btnSearch').click(function() { 
    console.clear(); 
    $.ajax({ 
     url: "/history/list", 
     data: { 
      startDate: $('#startDate').val(), 
      endDate: $('#endDate').val(), 
     }, 
     type: "GET", 
     dataType: "html", 
     success: function (data) { 
      var result = $('<div />').append(data).find('#historyList').html(); 
      $('#historyList').append(result); 
      console.log(result); 
// the result is displayed correctly in the console... 
     }, 
     error: function (xhr, status) { 
      alert("Sorry, there was a problem!"); 
     }, 
     complete: function (xhr, status) { 
      //$('#showresults').slideDown('slow') 
     } 
    }); 
});

這些方法沒有更新我的HTML ...數據對象包含HTML作爲結果，並且我希望數據對象中的HTML替換div標記下的所有內容，編號爲#historyList ..我在這裏做錯了什麼？

P.S.我正在使用Chrome瀏覽器（如果這是一個有用的信息）

來源

2016-05-25 perkes456

你能告訴我關於那個URL（「/ history/list」）是那個文件或目錄嗎？ – Ramkee

請張貼服務器端代碼太... –

/歷史< - 是一個控制器和列表是一個行動...我使用Zend框架2 – perkes456

我沒有得到結果。您可以使用.html，如下所示：

$('#historyList').html(data);

或者整個代碼都是這樣的。

$('#btnSearch').click(function() { 
      console.clear(); 
      $.ajax({ 
       url: "/history/list", 
       data: { 
        startDate: $('#startDate').val(), 
        endDate: $('#endDate').val(), 
       }, 
       type: "GET", 
       dataType: "html", 
       success: function (data) { 
        $('#historyList').html(data); 
        console.log(result); 
// the result is displayed correctly in the console... 
       }, 
       error: function (xhr, status) { 
        alert("Sorry, there was a problem!"); 
       }, 
       complete: function (xhr, status) { 
        //$('#showresults').slideDown('slow') 
       } 
      }); 
     });

來源

2016-05-25 12:31:35

我已經複製了整個代碼，它仍然不工作.. – perkes456

你可以發佈「數據」是什麼？ –

這是一個整頁與標籤和和標籤... – perkes456

確保$('#historyList')不是一個空數組，並存在於DOM中。如果存在，

$('#historyList').html(data);

應該解決問題。

如果我對問題的理解錯誤，請糾正我。

來源

2016-05-25 12:32:04

我剛剛嘗試過，但由於某些原因它仍未更新我的HTML .... – perkes456

在Ajax或jQuery調用後更新HTML

回答

相關問題