如果输入字段请求某些数据，则将数据从JSON文件渲染为HTML

Question

是否可以从.json文件中获取数据并使用HTML / JavaScript呈现它，例如，如果某人在输入字段中键入“example1”并且能够将与“example1”相关的数据呈现到该页面上？

我很确定这可以完成，因为如果输入字段从XML文件请求数据并使用JavaScript将数据呈现到该页面，我已经看到相同的情况。

这是我在JavaScript文件中的数据，但如果需要，肯定会放入.json文件中。

 var JSONObject = {

"id":"1",
"user" :"admin",
"pass":"admin",
"api":"000014556452446455455685454645"};

document.getElementById("jid").innerHTML=JSONObject.id
document.getElementById("juser").innerHTML=JSONObject.user
document.getElementById("jpass").innerHTML=JSONObject.pass
document.getElementById("japi").innerHTML=JSONObject.api
document.getElementById("jtest").innerHTML=JSONObject.test

Answer 1

是 - 使用jQuery。看看这里给出的例子：

http://api.jquery.com/jQuery.getJSON/

或此处：getjson jquery parsing an array

在后者中，数据显示在页面上：

$.getJSON(url,
    function(data){
      $.each(data.items, function(i,item){
      $('#testfield').html('<p>' + item.d.title + '</p>');
      });
    });

我假设用户输入应该只显示部分数据。然后，您可以发送一些查找数据并具有仅返回相关的功能，或者您可以循环访问数据并显示相关....就像（在循环中）：

if(item.d.title=myVar){      
  $('#testfield').html('<p>' + item.d.title + '</p>');
}