今天上课学到了jsonp，看了理解，还需要多敲，代码贴出来看看

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="智能社 - zhinengshe.com" />

<meta name="copyright" content="智能社 - zhinengshe.com" />

<title>智能社 - www.zhinengshe.com</title>

<script>

function jsonp(url,data,cbName,fn,timeout,fnFaild){

    var fnName = "jsonp_" + Math.random();

    fnName = fnName.replace(".","");

    //data.callback = fnName;

    //callback cb  xx  bbb

    data[cbName] = fnName;

    var arr = [];

    for(var name in data){

        arr.push(name + "="+ data[name]);

    }

    var str = arr.join("&");

    window[fnName] = function (json){

        fn && fn(json);

        oHead.removeChild(oS);

        clearTimeout(timer);

    }

     var oS = document.createElement("script");

     oS.src = url + "?" + str;

     var oHead = document.getElementsByTagName("head")[];

     oHead.appendChild(oS);

    if(timeout){

        var timer = setTimeout(function(){

            fnFaild();

            window[fnName] = function(){};

            oHead.removeChild(oS);

        },timeout);

    }

}

window.onload = function(){

    var oText = document.getElementById("txt1");

    //http://sug.so.360.cn/suggest?callback=xxx&word=aa

 var url = "http://sug.so.360.cn/suggest";

 //var url = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su";

    oText.onkeyup = function(){

        jsonp(

            url,

            {word:this.value,wd:this.value},

            "callback",

            //"cb",

            function (json){

                var oUl = document.getElementById("ul1");

                oUl.innerHTML = "";

                for(var i = ; i < json.s.length; i++){

                    var oLi = document.createElement("li");

                    oLi.innerHTML = json.s[i];

                    oUl.appendChild(oLi);

                }

            },

            ,

            function(){

                alert("超时失败");

            }

        );

    };

};

</script>

</head>

<body>

<input id="txt1" type="text" value=""/>

<ul id="ul1"> </ul>

</body>

</html>

jsonp 跨域1的更多相关文章

  1. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  2. 借助node实战JSONP跨域

    一.前言: 浏览器安全是基于同源策略的.所谓同源策略就是三相同: 1.协议相同: 2.域名相同: 3.端口相同. 但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限 ...

  3. jsonp跨域+ashx（示例）

    前言 做B/S项目的时候,我们一般使用jquery+ashx来实现异步的一些操作,比如后台获取一些数据到前台,但是如果ashx文件不在本项目下,引用的是别的域下的文件,这时候就访问不了.关于jsonp ...

  4. Jsonp跨域访问

    很早之前看过好几篇跨域访问的文章,然后做项目的时候基本没有遇到跨域访问的问题.不过该来的还是会来,前些天终于让我遇到了.于是重温了一下原理这些,再进行实战.于是现在也敢通过实战后的一些理解来和大家分享 ...

  5. jsonp 跨域请求

    背景: JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为"Same-Origin Policy"(同源 ...

  6. 我的jsonp跨域问题

    关于jsonp跨域问题,在这个方面也是了解一点点,先记录下来,主要作为以后查看,之前下载并安装过wampserver,了解到了jsonp和json的区别,现在谈谈跨域这个问题: 首先什么是跨域,简单地 ...

  7. jsonP跨域调用

    -------------------------------------jsonP跨域调用------------------------------------- <div class=&q ...

  8. JSONP跨域的原理解析( 一种脚本注入行为)

    JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制, 被称为“some-Origin Policy”(同源策略).这一策略对于Jav ...

  9. jsonp跨域问题

    JSONP是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式). 同源策略限制 ...

  10. JSONP跨域的原理解析

    JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same- Origin Policy”(同源策略).这一策略对于Jav ...

随机推荐

  1. idata，xdata，pdata，code

    data       --->   可寻址片内ram bdata     --->  可位寻址的片内ram idata      --->   可寻址片内ram,允许访问全部内部ra ...

  2. word2vec 中的数学原理详解（一）目录和前言【转】

    本文转载自:https://blog.csdn.net/itplus/article/details/37969519 word2vec 是 Google 于 2013 年开源推出的一个用于获取 wo ...

  3. P3216 [HNOI2011]数学作业 （矩阵快速幂）

    P3216 [HNOI2011]数学作业 题目描述 小 C 数学成绩优异,于是老师给小 C 留了一道非常难的数学作业题: 给定正整数 NN 和 MM ,要求计算 Concatenate (1 .. N ...

  4. 【命令】Redis常用命令整理

    doc 环境下使用命令:       keys 命令         ?    匹配一个字符         *    匹配任意个(包括0个)字符         []    匹配括号间的任一个字符, ...

  5. C语言通过枚举网卡，API接口可查看man 7 netdevice--获取接口IP地址

    /*代码来自StackOverflow: http://stackoverflow.com/questions/212528/linux-c-get-the-ip-address-of-local-c ...

  6. 第五次程序设计作业 C++计算器雏形 调用文件输入输出

    一.C++计算器作业系列链接 第三次作业:C++计算器雏形 第三次作业附加:代码规范 第四次作业:命令行的调用及计算 MyGithub 二.本次作业相关 要求:第五次程序设计作业 根据这一次的作业要求 ...

  7. 从零开始的四轴飞行器-开篇flag

    在这里立下flag,我要理解学会四轴飞行器的控制方法.

  8. HDU 6156 Palindrome Function

    http://acm.hdu.edu.cn/showproblem.php?pid=6156 题意:$f(n,k)$表示判断n在k进制下是否是回文串,如果是,则返回k,如果不是,则返回1.现在要计算$ ...

  9. RTC（x86)

    RTC 原创,转载请写明出处. 一直以来想写一篇关于RTC的总结,可是人太懒,在读完John Z. Sonmez大伽的<软技能代码之外的生存技能>后,终于下定决心,完成这项早已计划中的任务 ...

  10. Jmeter 同一个测试计划下的多个线程组 执行顺序 希望调整为顺序执行

    用Jmeter做自动化测试,一个测试计划中添加多个线程组, 每个线程组的功能测试,希望是一个线程组执行完毕后,接着执行下一个线程组下的请求 Jmeter默认多个线程组之间是并行关系 需要在测试计划下勾 ...