在JSP使用jquery更換DIV內容

到目前爲止，我一直在做一個AJAX調用替換另一個頁面div的內容，使用下面的代碼：在JSP使用jquery更換DIV內容

<script> 
    function fetchContainerContent(url, containerid) { 
     var req = false 

     if (window.ActiveXObject) { 
      try { 
       req = new ActiveXObject("Msxml2.XMLHTTP") 
      } catch (e) { 
       try { 
        req = new ActiveXObject("Microsoft.XMLHTTP") 
       } catch (e) {} 
      } 
     } else if (window.XMLHttpRequest) { 
      req = new XMLHttpRequest() 
     } else { 
      return false 
     } 

     req.onreadystatechange = function() { 
      requestContainerContent(req, containerid) 
     } 
     req.open('GET', url, true) 
     req.send(null) 
    } 

    function requestContainerContent(req, containerid) { 
     if (req.readyState == 4 && (req.status==200 || window.location.href.indexOf("http")==-1)) 
      document.getElementById(containerid).innerHTML = req.responseText 
    } 
</script>

我試圖轉換上述代碼如下使用jQuery，但它不起作用。換句話說，我試圖模仿上述行爲的最終結果，但它遠沒有那麼接近。事實上，屏幕上什麼也沒有發生，沒有任何變化。我應該提到，我並不真的需要加載...但由於我見過的例子使用它，並且因爲我不確定如何正確地語法化jQuery，所以我將它留下了。

<script> 
    function fetchContainerContent(url, containerid) { 
     jQuery.ajaxSetup ({ 
      cache: false 
     }); 
     var ajax_load = "loading...' />"; 

     jQuery("#load_basic").click(function() { 
      jQuery("#"+containerid).html(ajax_load).load(url); 
     }); 
    } 
</script>

在此先感謝。我對jQuery非常陌生，所以我可能做了一些非常愚蠢的事情。

後收到的所有意見（謝謝你們！）我已經只剩下：

function fetchContainerContent(url, containerid){     
var ajax_load = "loading...";    
$("#load_basic").click(function(){$("#"+containerid).html(ajax_load).load(url);});

}

，但我仍然有問題，因爲它沒有更新頁面。沒有js錯誤，沒有任何反應。

來源

2009-12-16 heeboir

請定義「不起作用」。有幾十個理由我們可以考慮。怎麼了？不會發生什麼？相應地編輯你的問題。 – BalusC 2009-12-16 13:07:49

哪部分不工作？你看到「加載...」的消息，然後沒有更多或是別的嗎？此外，你有沒有試過螢火蟲，看看是否有任何錯誤報告？ – kgiannakakis 2009-12-16 13:09:03

你說得對，我不是很清楚。我試圖模仿上述行爲的最終結果，但它遠不是那樣。事實上，屏幕上什麼也沒有發生，沒有任何變化。第一個片段發生的事情是，一個div會被來自url的代碼取代，但現在我根本沒有得到任何迴應。 – heeboir 2009-12-16 13:49:03

的只有我看根本的區別是：

您使用的是哈克的前瞻性裝載串"loading...' />"。這味道不好。
您正在用"#result"對containerid進行硬編碼，而不是使用"#" + containerid。
您正在使用JS代碼定義click事件，而不是（顯然）在元素中內聯。它最初是怎麼樣的？

對於剩餘的代碼看起來不錯。

來源

2009-12-16 13:12:48 BalusC

1.我不想使用加載...字符串，但我迄今爲止僅見過使用它的示例，並且我還沒有開始嘗試。 2.感謝您指出這一點。 3.最初我使用了一個名爲fetchContainerContent的onclick。這個想法是，點擊鏈接時，預定義的div會隨新內容一起更新。如果可能的話，我仍然希望保持這種邏輯。感謝您的幫助 – heeboir 2009-12-16 13:53:05

「/>」部分看起來不太好，它可能會惡化HTML。消毒或擺脫它。 – BalusC 2009-12-16 14:17:24

試試這個：

jQuery("#load_basic").click(function() { 
    jQuery("#result").html(ajax_load).load(url); 
    return false; 
});

注意在點擊處理程序結束的return false聲明。如果load_basic是按鈕或錨點元素，這將防止傳播點擊事件。

來源

2009-12-16 13:09:04

問題是它沒有調用你的回調方法？你必須回調.load方法。

<script> 
    function fetchContainerContent(url, containerid) { 
     jQuery.ajaxSetup ({ 
      cache: false 
     }); 
     var ajax_load = "loading...' />"; 

     jQuery("#load_basic").click(function() { 
      jQuery("#result").html(ajax_load).load(url, null, requestContainerContent); 
      return false; 
     }); 
    } 

    function requestContainerContent(responseText, textStatus, XMLHttpRequest) { 
     // do replacement in here 
    } 

</script>

你必須調整代碼在你requestContainerContent有點做你需要用它來提供的參數做什麼。

來源

2009-12-16 13:13:03

問題不在於方法的結構。不過謝謝你的回覆！ – heeboir 2009-12-16 13:54:02

好的，我似乎已經得到它的工作，即使我不太確定代碼的質量。

var ajax_load = "loading..."; 
$("#"+containerid).html(ajax_load).load(url);

來源

2009-12-17 14:12:34 heeboir

在JSP使用jquery更換DIV內容

回答

相關問題