JQuery jsonp 使用示例

最新推荐文章于 2024-08-20 08:45:37 发布

转载最新推荐文章于 2024-08-20 08:45:37 发布 · 1k 阅读

文章标签：

#jsonp #jquery #function #html #div #url

本文展示了一个使用JSONP跨域请求的例子，并通过jQuery实现数据获取及页面动态更新。该示例包括服务端PHP脚本与客户端JavaScript代码，具体演示了如何发送JSONP请求并解析返回的数据。

<?php
if (isset($_GET['jsonpcallback'])){
echo $_GET['jsonpcallback']."([{id:1,name:'aaaa1'},{id:2,name:'bbbb2'}])";
exit;
}
?>
<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>