将json数据插入列表中的html页面答案

【问题标题】：Inserting json data into html page in list将json数据插入列表中的html页面
【发布时间】：2012-08-04 23:52:12
【问题描述】：

我正在尝试从 mysql 获取信息并将信息发布到 html 页面中。这是我到目前为止所得到的：这是我的tenantlistmob.php

  <?php 
  include('connection.php');
  $result = mysql_query("SELECT * FROM tenanttemp");

  while ($row = mysql_fetch_assoc($result)) 
 {
   $array[] = array($row['TenantFirstName']);
  }
echo json_encode($array);
 ?>

当我直接从浏览器调用tenantlistmob 时，它会显示[["Humayun"],["Sahjahan"],["Bayezid"],["Bayezid"],["Asaduzzaman"],["Mouri"]]，其中有名字。我喜欢在 html 页面中使用这个名称。我的 html 页面是

<!DOCTYPE HTML>
<html>
<link rel="stylesheet" href="styles/main.css" />
<script type="text/javascript" src="jquery.js"></script> 
<body>
 <div id="output">this element will be accessed by jquery and this text replaced</div>
<script id="source" type="text/javascript">
 $(function () 
 {
$.ajax({                                      
  url: 'tenantlistmob.php',                
  data: "",                        
  dataType: 'json',                 
  success: function(data)          
  {
    var id = data;              
   //var vname = data[1];           //get name
    $.each(id, function (val)
   {        
     $('#output').html(""+id);
    });
  } 
});
}); 

</script>
<form id="formset">
<fieldset id="fieldset">
<h3 align="center">Tenant List</h3><hr/>
<a href="#">name1</a><br /><hr/>
<a href="#">name2 </a> <br /><hr/>
</fieldset>
</form>
<a id="box-link1" class="myButtonLink"  href="category1.php"></a> 
</div>    
 </body>
</html>

我的输出（main.css）是这样的

#output
{
color:#ffffff;
font-size : 20px;
margin : 0;
letter-spacing:1px;
width:480px;
}

我在左上角得到了Humayun,Sahjahan,Bayezid,Bayezid,Asaduzzaman,Mouri 的名字。但我喜欢将名称作为列表（name1,name2）与链接。当我点击一个名字（name1,name2）时，它会显示名字的详细信息。我该怎么做？

提前致谢

【问题讨论】：

如果我这样问，请不要笑：你知道你可以直接从 PHP 脚本生成 HTML，而不需要中间的 ajax 请求吗？另外，如果你喜欢使用 ajax，你可能想要使用一些模板，所以你只需要填写值。
顺便说一句，在您的DOCTYPE 中，html 应该是小写的。此外，script 元素的 language 属性在 HTML 5 中已弃用。此外，切勿使用 align 属性。它已被弃用多年。使用 CSS 使页面上的元素居中。最后，您的a 元素没有正确关闭，即<a href="addtenant.html" </a> 应该是<a href="addtenant.html">Add Tenant</a>
@hakre 我正在使用 ajax，因为这个 html 页面是由 android 设备通过 phonegap 调用的。 --"Micah Henning" 非常感谢，但是如何在href链接中获取html页面中的数据。
一个基于 javascript 的模板库是 mustache - 它与 json 配合得很好。
@hakre 非常感谢。这很有趣，但我没有时间展示这个任务。你能帮我如何在 html 页面中显示数据。请。

标签： php mysql json html

【解决方案1】：

您似乎希望使用 JavaScript 迭代 JSON。由于您使用的是 jQuery，因此您只需要“迭代” JSON 结果。从技术上讲，在 JavaScript 中 0 在 1 之前。

var _result = $data[0];
$.each(_result, function (val)
{
    console.log(val);
});

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

【讨论】：

大声笑你的评论让我想起了早期微软词中的回形针，“看起来像你......” +1 获取 api 链接
Lol 从来没想过，clippy 是用这个开头的。（自我注意：永远不要以“看起来像......”开始一个句子

【解决方案2】：

试试这个：

<?php 
  include('connection.php');
  $result = mysql_query("SELECT * FROM tenanttemp");

  $array = array();
  while ($row = mysql_fetch_assoc($result)) 
   {
     $array[] = $row['TenantFirstName'];
   }
  echo json_encode($array);
?>

【讨论】：

这更好，但不是我的解决方案。我喜欢在 html 页面中获取数据作为带有锚标记的列表。