2013-05-16 52 views
1

我想動態地每五秒鐘在我的頁面上重新加載一個div。但在我的迴應中,我得到了整個頁面的內容......我怎樣才能得到指定div的內容?只用AJAX刷新一個div

<script> 
function ajaxrefresh() 
{ 
    var xmlhttp; 

    if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
     xmlhttp=new XMLHttpRequest(); 
    } 
    else 
    {// code for IE6, IE5 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xmlhttp.onreadystatechange=function() 
    { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
      //Here i want only the content for the div from the response  
      document.getElementById("myDiv").innerHTML=xmlhttp.responseText; 
     } 
     else 
     { 
      //alert("state: "+xmlhttp.readyState) 
      //alert("status: "+xmlhttp.status) 
     } 
    } 

    xmlhttp.open("GET","http://${localHostAddress}:8080/adress",true); 
    xmlhttp.send(); 

    var t=setTimeout(ajaxrefresh,5000); 
} 

window.load = ajaxrefresh(); 
</script> 
+0

響應提供的數據是不是個人或祕密的,像銀行存款餘額,在服務器上創建軟件只發送你想要的信息可能比向瀏覽器端添加越來越多的代碼更可取。將此軟件綁定到其他網址。然後,您可以使用ajax僅請求該特定URL中的那部分數據。優點:更少的醜陋黑客,更少的網絡使用浪費,更好的可擴展性 – Paul

回答

0

你可以嘗試這樣的事:

if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    //Here i want only the content for the div from the response 
    var doc=document.createElement("div"); 
    doc.innerHTML=xmlhttp.responseText; 
    document.getElementById("myDiv").innerHTML=doc.getElementsByTagName("div")[5] 
    .innerHTML 

這裏5僅僅是一個隨機數,如果格始終是固定的,你可以使用該DIV所在的數目,如果它不是你需要通過div循環,找到你正在尋找的(可能基於id)。

+0

我不能調用doc.getElementById ... TypeError:doc.getElementById不是函數 – Jacob

+0

是的,如果你使用第一個選項,那麼你只能使用getElementsByTagName等,而不是getElementById,但第二個應該返回一個文檔對象,所以你可以使用getElementById。 – HMR

+0

不是第二種溶劑給出了相同的錯誤 – Jacob

1

有人已經在SO上問過這樣的問題。最好的投票是在你的頁面中創建一個無形的div,並用AJAX響應填充它,以便能夠通過hiddenDiv.getElementById("myDiv")獲取你需要的元素。

0

可能是你會得到一些想法從下面的腳本:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script> 

<script type="text/javascript"> 
     var auto_div_refresh = setInterval(function(){ 
    $('#load_data').load('fb_count.php').fadeIn("slow"); 
}, 10000); // refresh every 10000 milliseconds 
</script> 
+0

對不起,不能使用jquery – Jacob

1

正如你不能使用jQuery,我認爲最好的辦法是在響應AJAX調用返回時只能從服務器端的DIV內容。這樣,你的反應大小會更小,因此更快的太...

,如果你不能改變的要求使用下面的代碼

if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    //Here i want only the content for the div from the response 
    var mydiv= document.getElementById("myDiv"); 
    var doc=document.createElement("div"); 
    doc.innerHTML=xmlhttp.responseText; 
    document.body.appendChild(doc); // Note append temp to document 
mydiv.innerHTML=doc.getElementById("theDivYouWant") 
    .innerHTML; 
    document.body.removeChild(doc);// Note remove temp from document 
+0

這可能會導致奇怪的行爲,如果xml請求到當前打開的頁面,再次追加頁面可能會導致雙元素ID和getElementById可能不會返回您所期望的。 – HMR

+0

@HMR更新了答案 –