首页 > Web开发 > 详细

jqery ajax读取json文件

时间:2016-07-21 06:13:37      阅读:310      评论:0      收藏:0      [点我收藏+]

json文件数据

[
  {"name":"哈哈··","email":"邮箱01","gender":"男","hobby":["上网","打球"]},
  {"name":"呵呵··","email":"邮箱02","gender":"男","hobby":["网购","打球"]}
]

读取json文件并显示到元素中

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="../lib/jquery/jquery.min.js"></script>
</head>
<body>
    <div id="reslut"></div>
<script>
    $(document).ready(function(){
        $.ajax({
            /*请求方式*/
            type:"GET",
            /*json文件位置*/
            url:"user.js",
            /*返回数据格式为json*/
            dataType:"json",
            /*请求成功完成后要执行的方法*/
            success: function (data) {
              /*使用$.each方法遍历返回的数据data,*/
                $.each(data, function (index,obj) {
                    var content = obj.name +","+obj.email+","+obj.gender+","+obj.hobby[0]+","+obj.hobby[1]+"<br/>";
                    /*插入到类名为reslut的元素中*/
                    $("#reslut").append(content);
                });
            }
        })
    });
</script>
</body>
</html>

 

jqery ajax读取json文件

原文:http://www.cnblogs.com/lcf1314/p/5690231.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!