jquery的ajax跨域调用json

最新推荐文章于 2023-04-13 08:11:30 发布

jessica_p

最新推荐文章于 2023-04-13 08:11:30 发布

阅读量570

点赞数

分类专栏： jquery

本文链接：https://blog.csdn.net/jesscia_p/article/details/44980065

版权

jquery 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

需要动态获取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 请求的时候，指定这个回调函数名。

jessica_p

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jquery的ajax跨域调用json

需要动态获取Json中的数据，但是在本地死活都不能成功调用，chrome浏览器显示跨域失败，需要http,data等开头的链接。即使在chrome属性中加了 --allow-file-access-from-files 还是显示失败。最后就将json文件放到新浪云下，再调用，还是会提示失败，后来采用jsonp方式。下面贴出源码。player.htmlNow playing:
复制链接

扫一扫