美文网首页
ajax的使用以及jsonp的使用

ajax的使用以及jsonp的使用

作者: 战神飘雪 | 来源:发表于2016-11-17 11:11 被阅读29次

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>

<script src="js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
div>span{
display: block;
}
</style>
</head>
<body>
<form id="bbq">
<input type="text" name="tel"/>

        <input type="button" value="submit" onclick="ssd();"/>
    </form>
    <div>
        <span>1</span>
        <span></span>
        <span></span>
        <span></span>
        <span></span>
        <span></span>
        <span></span>
    </div>
    
</body>
<script type="text/javascript">
function addds(){

// i=5;
// var ime= setInterval(function(){
// console.log(ssbbq.province);
// i--;
// if (i<=0) {
// clearInterval(ime);
// }
// },1000)
$("div>span").eq(0).html(ssbbq.areaVid);
$("div>span").eq(1).html(ssbbq.carrier);
$("div>span").eq(2).html(ssbbq.catName);
$("div>span").eq(3).html(ssbbq.ispVid);
$("div>span").eq(4).html(ssbbq.mts);
$("div>span").eq(5).html(ssbbq.province);
$("div>span").eq(6).html(ssbbq.telString);
console.log($("div>span").eq(0).html());

}

function bbssdd(){
    var k =0;
    var obj =ssbbq;//上面复制的data
    $.each(obj, function(key, val) {

// alert(obj[key]);//可以输出成绩
console.log(key+":"+obj[key]);
// for(var i =0;i<obj.length;i++){
// console.log(obj);
$("div>span").eq(k).html(key+":"+obj[key]);
k++;
// }
// console.log();//可以输出姓名
});
}

function aabbcc(){
    var k =0;
    for(var i in ssbbq){
        
        console.log(i+":"+ssbbq[i]);
        console.log(k);
        $("div>span").eq(k).html(i+":"+ssbbq[i]);
        k++;
    }
}

    function ssd(){
        var qimingzihaonan  = $("#bbq").serialize(); 

// var data = "tel=13212180588";
console.log(qimingzihaonan);
// console.log(data);
$.ajax({
type:"get",
url:"https://tcc.taobao.com/cc/json/mobile_tel_segment.htm",
data:qimingzihaonan,
dataType: "jsonp",
jsonp: "callback",
async:true,
success:function(abc){
alert("csss");
// console.log(abc);
ssbbq = abc;
// addds();
bbssdd();
// aabbcc();
},
error:function(bbc){
alert("失败");
},
complete:function(XMLHttpRequest,textStatus){//成功失败都会调用的函数
alert(XMLHttpRequest.status);
}

    });
    
    }
    
    
</script>

</html>

相关文章

  • ajax的使用以及jsonp的使用

    div>span{display: block;} // ...

  • 常见跨域解决方案

    跨域 JSONP 使用 标签不受同源策略影响的特性,作为Ajax传输技术称为JSONP。 使用JSONP时,需要服...

  • vue+php=>微博

    问题 ajax 同时跨域使用的时候 不能使用 jsonp:"callback", jsonpCallback:"j...

  • 手写Ajax(JSONP)

    参考:原生 JavaScript 实现 AJAX、JSONP XMLHttpRequest的使用 参考:XMLHt...

  • JSONP

    使用JSONP解决同源限制问题 JSONP是json with padding的缩写,它不属于Ajax请求,但是可...

  • 复习jsonp和promise

    一.jsonp 1.jsonp是跨域访问api,ajax不能跨域 2.在vue中使用jsonp首先要安装jsonp...

  • 跨域

    服务器不允许跨域,只能使用$.ajax jsonp $.ajax({ url: `https://api.d...

  • Jquery跨域获取数据

    接入 PM2.5 数据 数据来源 接入方式 使用 Jquery ,直接请求数据,使用 jsonp 完成Ajax的跨...

  • ajax使用api和CORS以及JSONP(CORS+JSONP

    在使用ajax的时候存在一个问题: 相同域名下从后端获取数据是可以直接来获取的,而如果域名不相同,就会存在无法访问...

  • getJson完美解决跨越

    1.使用jquery的getJson进行跨域读取数据 实际上getJson方式的根本原理和ajax使用jsonp的...

网友评论

      本文标题:ajax的使用以及jsonp的使用

      本文链接:https://www.haomeiwen.com/subject/dysdpttx.html