实例1
test.html
<!doctype html> <html> <head> <meta charset="utf-8"> <title>test</title> <script src="jquery-1.5.2.min.js"></script> <script src="ajax.js"></script> </head> <body> </body> </html>
ajax.js
$.ajax({ type : "post", url : "ajax.php", datatype : "jsonp", jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback) jsonpcallback:"success_jsonpcallback",//自定义的jsonp回调函数名称，默认为jquery自动生成的随机函数名 success : function(json){ alert('success'); }, error:function(){ alert('fail'); } });
ajax.php
<?php $data = "......."; $callback = $_get['callback']; echo $callback.'('.json_encode($data).')'; exit; ?>
jquery-1.5.2.min.js
自己上网下载
当使用jsonp时，使用 jsonp 形式调用函数时，如 "myurl?callback=?" jquery 将自动替换 ? 为正确的函数名，以执行回调函数。
实例2
test.html
<!doctype html> <html> <head> <meta charset="utf-8"> <title>test</title> <script src="jquery-1.5.2.min.js"></script> <script src="ajax.js"></script> </head> <body> <form name="form"> <input type="text" name="sex"> <input type="text" name="age"> <input type="button" id="btn" value="button" /> </form> </body> </html>
ajax.js
$(document).ready(function(){ $("#btn").click(function(k) { //... var j = $("form").serializearray();//序列化name/value $.ajax({ type: 'get', //这里用get url: 'ajax.php', datatype: 'jsonp', //类型 data: j, jsonp: 'callback', //jsonp回调参数，必需 async: false, success: function(result) {//返回的json数据 alert(result.message); //回调输出 result = result || {}; if (result.msg=='err'){ alert(result.info); }else if (result.msg=="ok"){ alert('提交成功'); }else{ alert('提交失败'); } }, timeout: 3000 }) //... }); });
ajax.php
<?php $callback = isset($_get['callback']) ? trim($_get['callback']) : ''; //jsonp回调参数，必需 $date = array("age"=>$_get['age'], "message"=>$_get['age']); $date["msg"]="err"; $date["info"]="因人品问题，发送失败"; $tmp= json_encode($date); //json 数据 echo $callback . '(' . $tmp .')'; //返回格式，必需 ?>
jquery-1.5.2.min.js
自己从网上下载
相关推荐：
js跨域请求服务实例分析
ajax前台后台跨域请求处理方式
vue使用axios跨域请求数据实例详解
以上就是php中ajax和jsonp实现跨域请求的详细内容。