码迷,mamicode.com
首页 > Web开发 > 详细

jqery ajax读取json文件

时间:2016-07-21 06:15:30      阅读:133      评论: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
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!