Question

我在根据我的ID获取特定数据时遇到问题。这是我的主要HTML。

<div class="container">
<div class="row">
 <div class="col-md-12">
    <button id="btn">Button</button>
    <br>
    <div id="id01"></div>
</div>
</div>
</div>

这是我的主要js

 var btn=document.getElementById("btn");
btn.addEventListener("click", function(){
var ourRequest = new XMLHttpRequest();
var url = "url.../incident";
contentType="applicaton/json; charset=utf-8";
method="GET";
dataType= "json";

ourRequest.onreadystatechange=function() {
if (this.readyState == 4 && this.status == 200) {
    myFunction(this.responseText);
}
}
ourRequest.open("GET", url, true);
ourRequest.send();
});
function myFunction(response) {
var arr = JSON.parse(response);
var out = "<table>";

for(i = 0; i < arr.length; i++) {
    out += "<tr><td>" + 
    arr[i].Address +
    "</td><td><a href='lista.html?id="+arr[i].ID+"'>" +
    arr[i].ID +
    "</a></td><td>" +
    arr[i].Category +
    "</td></tr>";
}
out += "</table>";
document.getElementById("id01").innerHTML = out;
}

这只会显示三个数据。

这是我的lista.html

 <div class="container">
 <div class="row">
 <div class="col-md-12">
    <div id="id02">
    </div>
   </div>
</div>

这是我的lista.html的js。

 var ourRequest = new XMLHttpRequest();
 var url = "url../incident?id=";
 contentType="applicaton/json; charset=utf-8";
 method="GET";
 dataType= "json";

 ourRequest.onreadystatechange=function()
 {
  if (this.readyState == 4 && this.status == 200) {
   myFunction(this.responseText);
  }
 }

 ourRequest.open("GET", url, true);
 ourRequest.send();
 function myFunction(response)
 {
  var arr = JSON.parse(response);
  var out = "<table>";
  out +="<tr><td>" + 
  arr.Address +
    "</td><td>" +
    arr.CaseID +
    "</td><td>" +
    arr.Category +
    "</td><td>" +
    arr.Date +
    "</td><td>" +
    arr.Description +
    "</td><td>" +
    arr.ID +
    "</td><td>" +
    arr.InputDate +
    "</td><td>" +
    arr.Latitude +
    "</td><td>" +
    arr.Longitude +
    "</td><td>" +
    arr.ReportedBy +
    "</td><td>" +
    arr.Subcategory +
    "</td><td>" +
    arr.Time +
    "</td></tr>"
  out += "</table>";
  document.getElementById("id02").innerHTML = out;
 }

所以，当我点击那个arr [i] .ID时，它应该将我发送给具有特定ID和特定数据的lista.html。例如，如果我点击ID = 1，则网址看起来像lista.html？id = 1，但没有显示。

Answer 1

如果您发送请求的api

，只需将id传递给请求网址即可

var url = "url?id={your id here}"

Answer 2

在你的表中，你必须使用arr.Address而不是response.Address，因为arr是解析的json对象。

您可以使用console.log查看您所需的数据是否确实存在：

function myFunction(response) {
  var arr = JSON.parse(response);
  console.log(arr);
}

您不需要使用jQuery读取位置href，因为您已经知道您发送的请求的ID！

Answer 3

所以我的错误是这样而不是：

var url = "url../incident?id=";

我应该写：

var url = "url../incident?id="+getQueryVariable("id");

在我的js for lista.html

的末尾写下这个函数

   function getQueryVariable(variable)
   {
   var query = window.location.search.substring(1);
   var vars = query.split("&");
   for (var i=0;i<vars.length;i++) {
           var pair = vars[i].split("=");
           if(pair[0] == variable){return pair[1];}
   }
   return(false);
   }

根据网址获取json数据

3 个答案: