ajax 跨域访问即jsonp的非详细用法
日期：2014-05-16 浏览次数：20427 次
ajax 跨域访问即jsonp的非详细用法！
[url][/url]新建ticker.js
然后新建一个页面引用它
以上实例描述了简单jsonp的应用！
jQuery 的 JSONP 支持
服务器端php代码
使用 JSONP 回调
参考：
http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/
http://www.jb51.net/article/19624.htm
[url][/url]新建ticker.js
// JavaScript Document
showPrice({symbol:"四宝",price:"价格"});
然后新建一个页面引用它
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>111</title>
</head>
<body>
<script type="text/javascript">
// This is our function to be called with JSON data
function showPrice(data) {
alert("Symbol: " + data.symbol + ", Price: " + data.price);
}
var url = "http://www.esouluo.com/oldweb/ticker.js"; // URL of the external script
// this shows dynamic script insertion
var script = document.createElement('script');
script.setAttribute('src', url);
// load the script
document.getElementsByTagName('head')[0].appendChild(script);
</script>
</body>
</html>
以上实例描述了简单jsonp的应用！
jQuery 的 JSONP 支持
<html>
<script type='text/javascript' src='commons/scripts/jquery.js'></script>
<script type='text/javascript'>
$(function(){
$.ajax({
url:'http://localhost/test.php',
dataType:"jsonp",
jsonp:"jsonpcallback",
success:function(data){
var $ul = $("<ul></ul>");
$.each(data,function(i,v){
$("<li/>").text(v.id + " " + v.name).appendTo($ul)
});
$("#res").append($ul);
}
});
});
</script>
<body>
<div id='res'></div>
</body>
</html>
服务器端php代码
<?php
if (isset($_GET['jsonpcallback'])){
echo $_GET['jsonpcallback']."([{id:1,name:'aaaa1'},{id:2,name:'bbbb2'}])";
exit;
}
?>
使用 JSONP 回调
jQuery.getJSON("http://localhost/test.php?callback=?", function(data){
var $ul = $("<ul></ul>");
$.each(data,function(i,v){
$("<li/>").text(v.id + " " + v.name).appendTo($ul)
});
$("#res").append($ul);
});
参考：
http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/
http://www.jb51.net/article/19624.htm
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
