jqueryajax和jsonp跨域传值⽅法
因为HTTP出于安全考虑,ajax是不允许跨域访问的,不过跨域通过scrip的src传递参数访问。js原⽣⽅法看我ajax下的⽂章。因为jQuery已经封装好了,我们直接传递参数就可以了。
HTML页⾯,有两个按钮⼀个普通⽅法,dataType:HTML,也可以传递HTML代码。
其中jsonp 和 jsonpCallback 参数都是可加可不加的。如果不加,服务器端的⽅法名就⼀点要写callback
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquery-ajax</title>
</head>
<body>
<input type="button" value="点击" id="btn">
<input type="button" value="点击" id="btn2">
<div id="showInfo"></div>
<script type="text/javascript" src="js/jquery-1.11.2.js"></script>
<script type="text/javascript">
$(function(){
$("#btn").click(function(){
$.ajax({
url:"01jquery.php",//⼀个⽤来包含发送请求的URL字符串。
dataType:"script",//放回值的类型,可以是HTML,text,
type:"get",
success:function(data){//请求成功后的回调函数
// $("#showInfo").html(data)
data;
},
error:function(e){
console.log(e);
}
});
});
$("#btn2").click(function(){
$.ajax({
url:"02jquery.php",//⼀个⽤来包含发送请求的URL字符串。
dataType:"jsonp",//返回值的类型
type:"get",
data:{citycode:123,flag:"abc"},//传递的值
jsonp: "cb",//传递给请求处理程序或页⾯的,⽤以获得jsonp回调函数名的参数名(默认为:callback,都不加参数为 ) //jsonpCallback:"myfun",//⾃定义的jsonp回调函数名称,默认为jQuery⾃动⽣成的随机函数名(都加参数cb=myfun)
success:function(data){//请求成功后的回调函数
// console.log(data[1])
$.each(data,function(i,el){
jquery实现ajaxvar op = $("<li>"+i+">>>"+el+"</li>")
$("#showInfo").append(op);
});
},
error:function(e){
console.log(1);
console.log(e);
}
});
});
});
</script>
</body>
</html>
01jquery
<?php
// 可以放字符串、HTML标签、JavaScript、只不过ajax的dataType值修改⼀下就可以了
//$tag ="hello ajax";
//$tag = '<div>⽔果</div><div>⽔果</div><div>⽔果</div><div>⽔果</div><div>⽔果</div><div>⽔果</div><div>⽔果</div><div>⽔果</div>';
$tag = 'alert(123);';
echo$tag;
?>
02jquery
<?php
$citycode= $_GET['citycode'];
$flag= $_GET['flag'];
$callback = $_GET['cb'];////如果ajax页⾯的jsonp 参数不填。我们就写这个格式 $callback = $_GET['callback']; $arr=array($citycode,$flag,"BMW");
echo$callback.'('.json_encode($arr).')';
?>
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论