.html（）方法不改變div內容

你好傢伙需要一些幫助。我有這樣的ajax代碼。.html（）方法不改變div內容

$(document).ready(function() { 
    $(".ajaxLoadPage").click(function(){ 
     var page=$(this).attr('id'); 
     alert(page); 
     $.ajax({ 
      type:'GET', 
      url:"/SMS/jsp/"+page+".do", 
      async:false, 
      dataType:"html", 
      cache:false, 
      success:function(result){ 
       $('#main-content').html(result); 
      } 
     }); 
    }); 
}),

它成功地從服務器返回的「結果」，但是當我試圖用結果覆蓋DIV #main-content像

$('#main-content').html(result);

爲第二幾個分數div#main-content是獲得替換/覆蓋'結果'，但在此之後div#main-content會自動加載前一個/舊內容？

請幫我我正是爲什麼這個錯誤發生。

來源

2015-11-06 SaaD Ahmed

檢查的ID是重複的。如果沒有，請添加完整的HTML – Tushar

聽起來像您的網頁以某種方式重新加載...您不是在提交表單嗎？結果是什麼樣的？而FYI，'async：false'是不行的 –

'console.log（result）'說什麼？ – Reeno

這個用例有專門的jQuery函數。它被稱爲（docs）。

$(function() { 
    $(".ajaxLoadPage").click(function() { 
     $('#main-content').load("/SMS/jsp/" + this.id + ".do"); 
    }); 
});

即使你不想使用此功能，您的方法仍然複雜得多，它必須是：

$(function() { 
    $(".ajaxLoadPage").click(function() { 
     $.get("/SMS/jsp/" + this.id + ".do").done(function (result) { 
      $('#main-content').html(result); 
     }); 
    }); 
});

注：

沒有一個單一原因使用同步Ajax請求。永遠。
從服務器發送適當的HTTP緩存頭，並且不需要影響客戶端的緩存行爲。這總是可取的。
當$.get()完成這項工作時，沒有必要使用$.ajax()。
$(this).attr('id')是一個非常詳細的方式說this.id。

來源

2015-11-06 13:47:14 Tomalak

Ya ，但是如何解決OP的問題？'event.preventDefault（）;'聽起來像缺少的東西 –

@ A.Wolff它可能不會，因爲OP的問題似乎並不在他顯示的示例代碼中。如果'.ajaxLoadPage'是一個''，那麼是的，或者像'href =「＃」'）。 – Tomalak

@ Tomalak，你好，非常非常感謝，你的建議對我來說非常合適。謝謝。 –

你曾經說過：

async:false

這意味着JavaScript的將阻止一切被在頁面上發生的事情。

對於第二個div的幾分之一＃main-content被替換/用'result'覆蓋，但在此之後，div＃main-content會自動加載前一個/舊內容？

這意味着你通過自然加載新頁面來觸發JavaScript。可能點擊鏈接或提交表單。

如果您沒有async:false，它會剛剛重新加載頁面而不等待JS運行。

要正確地解決這個問題：

寫quality HTML and enhance it with JavaScript。

設置觸發JS的鏈接，所以它做的是正確的事when JS fails。（注意：你應該得到這個返回一個完整的HTML文檔）。

<a href="/SMS/jsp/something.do">...</a>

然後你可以在JavaScript中使用href。

url: $(this).attr('href'),

確保您阻止鏈接的默認行爲時JS可用：

$(".ajaxLoadPage").click(function(event){ 
    event.preventDefault();

你需要適應$('#main-content').html(result);所以它過濾掉你沒有更新的內容（如主導航）。

並且不要阻止瀏覽器在等待來自服務器的數據時與其他內容相關（刪除async:false,）。

來源

2015-11-06 13:52:32 Quentin

休耕評論已經幫我解決我的問題
(If .ajaxLoadPage is an <a>, then yes. That, or something like href="#") 鑑於@Tomalak

來源

2015-11-30 17:25:11

.html（）方法不改變div內容

回答

相關問題