php_jq_ajax

XMLHttpRequest cannot load 错误: 发生了跨域

什么情况会发生跨域?
    1.域名,X级域名不同,端口号不同会发生跨域

    进行AJAX请求的文件所在的服务器的域名:端口号
    和请求的url所在的服务器的域名:端口号 不一致

    解决跨域方式:
    1.代理
    2.jsonp
    3.iframe

iframe解决跨域问题

<iframe src="http://www.baidu.com/s?wd=蓝色天空" frameborder="0" width="100%" height="100%"></iframe>

代理解决跨域问题

<script src="ajax.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    ajax("get","index.php",{},function(res){
        //console.log(res);
        var obj = JSON.parse(res);
        //console.log(obj);
        var arr = obj.T1348647853363;
        for(var i = 0; i < arr.length; i++){
            console.log(arr[i].title);
        }
    },true);
</script>
-------------------------------------------------
index.php
<?php
    //$str = file_get_contents("http://wx.xinewang.com/xdAdminOpe/all");
    $str = file_get_contents("http://c.m.163.com/nc/article/list/T1348647853363/0-20.html");
    echo $str;
?>

jsonp解决跨域问题

<script type="text/javascript">
//php代码里,回调了JS的一个方法
function success(res){
    console.log(res);
}
</script>
<!--script标签利用src引用的内容会被认为是js代码进行编译-->
<script src="http://lidongxu.applinzi.com/thejsonp.php?callback=success" 
type="text/javascript" charset="utf-8"></script>
<!--success({{"name":"李四", "hobby":"那啥"}})-->

----------------------------------------------------
src 

<?php
    $cb = $_GET["callback"]; // 接收JS方法名字
    $jsonStr = '{"name":"李四", "hobby":"那啥"}';
    // 直接通过script访问的php文件, 本来就是script的东西
    echo "$cb({$jsonStr})";
    //$cb 方法名  () 调用
?>

jsonp实例

<input type="text" name="name" id="search" />
<input type="submit" value="搜索" id="submit" onclick="btn()"/>
<div id="content"></div>

<script id="b"></script>
<script type="text/javascript">
    var content = document.getElementById("content");
    function success(res){
        console.log(res);
        for(var i = 0; i < res.s.length; i++){
            content.innerHTML += res.s[i] + "</br>";
        }
    }
    function btn(){
        var searchInput = document.getElementById("search");
        var str = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=";
        str += searchInput.value;
        str += "&json=1&p=3&sid=1439_21103_18560_17001_20698_22918&req=2&sc=eb&csor=0&cb=success&_=1496304074103";
        //网址是 百度联想的下拉栏上的数据,支持jsonp请求
        var jsonScript = document.getElementById("b");
        jsonScript.src = str;
        //document.write() 当你网页上的东西加在完毕后,再调用 document.write() 会覆盖你页面所有的东西
    }
</script>

jq之请求

<script src="js/jquery-3.0.0.js" ></script>
<script type="text/javascript">
    //1.不传参get请求
    /*$.ajax({
       type: "get",
       url: "../01/php/",
       success: function(res){
         alert( "Data Saved: " + res );
       }
    });*/

    //2.get请求传参数
    /*$.ajax({
        type: "get",
        url: "../01/php/2get.php",
        data:{
            name:"王",
            age:18,
            sex:"男"
        },
        success: function(res){
            alert( "Data Saved: " + res );
        }
    });*/
    //3.post传参
    $.ajax({
        type: "POST",
        url: "../01/php/3post.php",
        data:{
            name:"John",
            address:"Boston",
            sex:"男"
        },
        success: function(msg){
            alert( "Data Saved: " + msg );
        },
        error:function(e){
            console.log(e.statusText);
        }
    });
    ----------------------------------------------------
    1.php
    <?php
    echo "恭喜你, 得到了我!";
    ?>

    2get.php
    <?php
        $userName = $_GET["name"];
        $age = $_GET["age"];
        $sex = $_GET["sex"];
        echo $userName.$age.$sex;

    3.post.php
    <?php
        $userName = $_POST["name"];
        $age = $_POST["address"];
        $sex = $_POST["sex"];
        echo $userName.$age.$sex;
    ?>

jq之跨域请求

<script src="js/jquery-3.0.0.js" ></script>
<script type="text/javascript">
    $.ajax({
        type:"get",
        url:"http://lidongxu.applinzi.com/thejsonp.php",
        data:{
            name:"王",
            mon:456,
            tele:"186"
        },
        dataType:"jsonp",
        success:function(res){
            console.log(res);
        },
        error:function(e){
            console.log(e.statusText);
        }
    });

</script>

JSON.parse()和JSON.stringify()

parse用于从一个字符串中解析出json对象,如
var str = '{"name":"huangxiaojian","age":"23"}'
结果:
JSON.parse(str)
Object
age: "23"
name: "huangxiaojian"
__proto__: Object
注意:单引号写在{}外,每个属性名都必须用双引号,否则会抛出异常。
----------
stringify()用于从一个对象解析出字符串,如
var a = {a:1,b:2}
结果:JSON.stringify(a)    "{"a":1,"b":2}"

php中json_decode()和json_encode()

<?php 
$json = '{"a":1,"b":2,"c":3,"d":4,"e":5}'; 
var_dump(json_decode($json)); 
var_dump(json_decode($json, true)); 
?> 

object(stdClass)#1 (5) { 
["a"] => int(1) 
["b"] => int(2) 
["c"] => int(3) 
["d"] => int(4) 
["e"] => int(5) 
} 

array(5) { 
["a"] => int(1) 
["b"] => int(2) 
["c"] => int(3) 
["d"] => int(4) 
["e"] => int(5) 
} 


----------
<?php 
$arr = array ('a'=>1,'b'=>2,'c'=>3,'d'=>4,'e'=>5); 
echo json_encode($arr); 
?> 

{"a":1,"b":2,"c":3,"d":4,"e":5} 

jquery ajax error函数和及其参数详细说明

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值