gpt4 book ai didi

php - 将 JSON 转换为 html 表

转载 作者:行者123 更新时间:2023-12-02 18:50:28 25 4
gpt4 key购买 nike

我已经做了的是:我编写了一个 php 脚本,它与我的 JSON 数据结构相呼应。我现在正在尝试编写一个 Html 脚本,该脚本将以 JSON 格式获取结果,但在下面的 html 表中回显此内容是我的 PHP 脚本和我尝试的 HTM 脚本。任何关于如何做到这一点的提示,我将不胜感激。

 <html>
<head>
<title>Details B</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="robots" content="noindex, nofollow" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function() {
JSONload();
})
function JSONload() {
$('#results').empty();
$('<table id="table2" border="1"/>').appendTo('#results');
$.get("details.php", {date1:$('#date_1').val(),date2:$('#date_2').val()}, function(result){
for(elem in result[0])
$('<th scope="col">'+elem+'</th>').appendTo('#table2');
for(var i = 0; i <= result.length; i++) {
$('<tr id="'+(i)+'" />').appendTo('#table2');
for(elem in result[i]) {
$('<td>'+result[i][elem]+'</td>').appendTo('#'+i);
}
}
},'json');
}
</script>
</head>
<body>
<table>
<tr>
<td>
<div class="fixed">
</div>
</td>
</tr>
</table>
<br />
<table border="1">
<tr>
<th scope="col">Key</th>
<th scope="col">Value</th>
</tr>
<tr>
<td> <label for="date_1">Date as dd/mm/yyyy (date_1)</label></td>
<td>
<input name="date_1" type="text" class="larger" id="date_1" value="31/1/1970" size="12" />
</td>
</tr>
<tr>
<td><label for="date_2">Date as dd/mm/yyyy (date_2)</label></td>
<td>
<input name="date_2" type="text" class="larger" id="date_2" value="31/1/1990" size="12" />
</td>
</tr>

<tr>
<td>List name of all cyclists with their country's name, gdp and population</td>
<td><input type="button" onClick="JSONload()" name="submit" id="button" value="Submit" class="larger" /></td>
</tr>

<tr>

</tr>
</table>
<div id="results" />
</body>
</html>

最佳答案

我建议你看看一些流行的 jQuery 插件:

  • DataTables 。我在几个项目中使用过它。通常我会创建一个由客户端调用的处理程序来提供 JSON 格式的数据。该插件负责渲染、分页、排序和过滤。

  • jqGrid 。我没有使用它的经验,但它被一个巨大的社区使用。

关于php - 将 JSON 转换为 html 表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15881606/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com