分别在jsp和html中显示JSON数据 [英] Display JSON data in jsp and html respectively
问题描述
我是Java的新手.我的test.json文件是一个以以下格式开头的数组:
I'm a newbie to Java. My test.json file is an array that starts in the following format:
{
"Result": "OK",
"TotalRecordCount": 23,
"Records": [{
"vEmail": "blabla@gmail1.com",
"vUserName": "admin",
"nDepartmentId": "6750",
"nEnabled": "1",
"department": 6750,
"vFatherName": "mixalis",
"vSurname": "mixalis",
"vAfm": "123456",
"vUsertype": "",
"vName": "mixalis",
"nId": "5651",
"rolesDesc": ""
},
以此类推...
我不明白jsp和html可以做什么...我的意思是在这件事上(我想通过读取json文件显示数据)都可以得到相同的结果吧?和相同的代码对吗? ...好吧，可以在我的jsp或html页面中使用以下代码来完成此操作.还是因为我很困惑，不知道去的原因是......我有一个简单的页面
I cant understand what the jsp and the html can do... i mean in this matter (i want to display the data by reading the json file)both can have the same result right? and same code right? ... ok this can be done with the following code in my jsp or my html page.. like that in the body section ? or in the head cause i m confused and dont know were goes were.... i have the simple page
<html>
<head>
<title>Loading JSON files using jQuery</title>
</head>
<body>
<h1 id="title"></h1>
<ul id="list"></ul>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$.getJSON("test.json", function(json){
$("#email").text(json.vEmail);
$.each(json.vUserName, function(key, val) {
$("<li><a href='http://" + val + "'>" + val + "</a></li>").appendTo("#list");
}); // each()
}); // .getJSON()
}); // ready()
</script>
</body>
</html>
您会注意到，出于测试目的，我并没有写所有数据，只有vEmail和vUserName了，但是当我在Netbeans中运行它时，什么也没有显示.
You will notice that for testing purposes I haven't written all the data, only vEmail and vUserName but when I run it in Netbeans nothing showed up.
推荐答案
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script>
<script>
$(function() {
var people = [];
$.getJSON('test.json', function(data) {
$.each(data.records, function(i, f) {
var tblRow = "<tr>" + "<td>" + f.vEmail + "</td>" + "<td>" + f.vUserName + "</td>" + "<td>" + f.nDepartmentId + "</td>" + "<td>" + f.nEnabled + "</td>" + "<td>" + f.department + "</td>" + "<td>" + f.vFatherName + "</td>" + "<td>" + f.vSurname + "</td>" + "<td>" + f.vAfm + "</td>" + "<td>" + f.vUsertype + "</td>" + "<td>" + f.vName + "</td>" + "<td>" + f.nId + "</td>" + "<td>" + f.rolesDesc + "</td>" + "</tr>"
$(tblRow).appendTo("#userdata tbody");
});
});
});
</script>
</head>
<body>
<div class="wrapper">
<div class="profile">
<table id= "userdata" border="2">
<thead>
<th>Email</th>
<th>User Name</th>
<th>Department Id</th>
<th>Enabled</th>
<th>Department</th>
<th>Father Name</th>
<th>Surname</th>
<th>Afm</th>
<th>User Type</th>
<th>Name</th>
<th>Id</th>
<th>Roles Desc</th>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</body>
</html>
这篇关于分别在jsp和html中显示JSON数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
