- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title></title>
- <script src="JS/jquery-1.8.0.min.js" type="text/javascript"></script>
- <script type="text/javascript">
- $(function () {
- $.ajax({
- url: 'jsondata.ashx',
- type: 'GET',
- dataType: 'json',
- timeout: 1000,
- cache: false,
- beforeSend: LoadFunction, //加载执行方法
- error: erryFunction, //错误执行方法
- success: succFunction //成功执行方法
- })
- function LoadFunction() {
- $("#list").html('加载中...');
- }
- function erryFunction() {
- alert("error");
- }
- function succFunction(tt) {
- $("#list").html('');
- //eval将字符串转成对象数组
- //var json = { "id": "10086", "uname": "zhangsan", "email": "zhangsan@qq.com" };
- //json = eval(json);
- //alert("===json:id=" + json.id + ",uname=" + json.uname + ",email=" + json.email);
- var json = eval(tt); //数组
- $.each(json, function (index, item) {
- //循环获取数据
- var name = json[index].Name;
- var idnumber = json[index].IdNumber;
- var sex = json[index].Sex;
- $("#list").html($("#list").html() + "<br>" + name + " - " + idnumber + " - " + sex + "<br/>");
- });
- }
- });
- </script>
- </head>
- <body>
- <ul id="list">
- </ul>
- </body>
- </html>
Jquery 使用Ajax获取后台返回的Json数据后,页面处理
最新推荐文章于 2021-11-13 17:10:00 发布