2017-08-29 112 views
2

如果我不使用var productOj並輸出響應。 innerHTML = this.response; 我會迴應這個{「細節」:「這是細節」,「鏈接」:「/ link/here」},所以響應回來json,但我想訪問個別細節和鏈接,並輸出到別的地方。在Javascript中接收Json數組並輸出結果

function getProduct(productName) { 
    if (productName == "0") { 
     document.getElementById("instr_text").innerHTML = "Please Select A Product"; 
     return; 
    } else { 
     // document.getElementById("orderSummary").innerHTML = str; 

     xmlhttp = new XMLHttpRequest(); 
     xmlhttp.onreadystatechange = function() { 
      if (this.readyState == 4 && this.status == 200) { 
       //document.getElementById("orderSummary").innerHTML = "success"; 
       var productObj = JSON.parse(this.responseText); 
       document.getElementById("detail").innerHTML = productObj.detail; 


      } else { 
       //document.getElementById("orderSummary").innerHTML = "failure" + this.readyState + this.status; 
      } 
     }; 
     xmlhttp.open("GET", "getinfo.php?productName=" + productName,true); 
     xmlhttp.send(); 
    } 
} 
+0

JQuery是一個選項嗎?我認爲你會發現一個JQuery實現更簡單。 – HumbleWebDev

+0

我知道,但由於某種原因,我不喜歡jquery – JaP

回答

1

它可能看起來像這樣。

var productObj = JSON.parse(this.responseText); 
var productHtml = ""; 
productObj.forEach(product => productHtml += "<p>" + product.detail + "</p>") 
document.getElementById("detail").innerHTML = productHtml; 

你在做什麼,通過每個元素在你的productObj陣列會和創造,你要尋找的HTML。一旦你有了你想要的html的blob,你可以將它附加到你選擇的div中。您也可以重複/修改此過程以訪問link

+0

好主意。我試了一下,我沒有工作,但我認爲我錯誤地實施了它。我會試着找出它爲什麼沒有輸出任何東西。 – JaP

相關問題