您的位置：首页 > Web前端 > JQuery

jquery的ajax跨域调用json

2015-04-10 15:15 363 查看
需要动态获取Json中的数据，但是在本地死活都不能成功调用，chrome浏览器显示跨域失败，需要http,data等开头的链接。即使在chrome属性中加了 --allow-file-access-from-files 还是显示失败。最后就将json文件放到新浪云下，再调用，还是会提示失败，后来采用jsonp方式。下面贴出源码。player.html
<span style="font-size:18px;"><!doctype html>
<html>
<head>
<title>Now playing: </title>
</head>
<body>
Play history
<ol id="history">
<input type="button" id="button" name="button"/>
</ol>

<script src="js/jquery.js"></script>
<script src="js/jquery-ui.js"></script>

<script>
$(document).ready(function(){
$('#button').click(function(){
$.ajax({
type:"GET",
async:false,
url:"http://1.jessicap.sinaapp.com/test.json",
dataType:"jsonp",//这里写jsonp
jsonpCallback:"feedback", //这里的名字必须和json里面的名字匹配。可以返回json数据
success:function(data){
alert(data[0].channel+data[0].bb+data[0].aa);

},
error:function(){
alert("fail");
}
});
});
});

</script>

</body>
</html></span>
test.json
feedback([{
"channel": "aa",
"bb": "4",
"aa": "5"
}])
type:
默认值: "GET")。请求方式 ("POST" 或 "GET")， 默认为 "GET"。注意：其它 HTTP 请求方法，如 PUT 和 DELETE 也可以使用，但仅部分浏览器支持。
async；默认值: true。默认设置下，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为 false。注意，同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行。
dataType类型：String预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断，比如 XML MIME 类型就被识别为 XML。在 1.4 中，JSON 就会生成一个 JavaScript 对象，而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后，传递给回调函数。可用值:"xml": 返回 XML 文档，可用 jQuery 处理。"html": 返回纯文本 HTML 信息；包含的 script 标签会在插入 dom 时执行。"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了 "cache" 参数。注意：在远程请求时(不在同一个域下)，所有 POST 请求都将转为 GET 请求。（因为将使用 DOM 的 script标签来加载）"json": 返回 JSON 数据 。"jsonp": JSONP 格式。使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。"text": 返回纯文本字符串jsonpCallback类型：String为 jsonp 请求指定一个回调函数名。这个值将用来取代 jQuery 自动生成的随机函数名。这主要用来让 jQuery 生成度独特的函数名，这样管理请求更容易，也能方便地提供回调函数和错误处理。你也可以在想让浏览器缓存 GET 请求的时候，指定这个回调函数名。
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航