window.ajaxJsonp=function(params) {
params = params || {};
params.data = params.data || {};
var json = params.jsonp ? jsonp(params) : json(params);
// jsonp请求
function jsonp(params) {
//创建script标签并加入到页面中
var callbackName = params.jsonp;
var head = document.getElementsByTagName('head')[0];
// 设置传递给后台的回调参数名
params.data['callback'] = callbackName;
var data = formatParams(params.data);
var script = document.createElement('script');
head.appendChild(script);
//创建jsonp回调函数
window[callbackName] = function(json) {
head.removeChild(script);
clearTimeout(script.timer);
window[callbackName] = null;
params.success && params.success(json);
};
//发送请求
script.src = params.url + '?' + data;
//为了得知此次请求是否成功,设置超时处理
if(params.time) {
script.timer = setTimeout(function() {
window[callbackName] = null;
head.removeChild(script);
params.error && params.error({
message: '超时'
});
}, time);
}
};
//格式化参数
function formatParams(data) {
var arr = [];
for(var name in data) {
arr.push(encodeURIComponent(name) + '=' + encodeURIComponent(data[name]));
};
// 添加一个随机数,防止缓存
arr.push('v=' + random());
return arr.join('&');
}
// 获取随机数
function random() {
return Math.floor(Math.random() * 10000 + 500);
}
}

  

js的jsonp的更多相关文章

  1. 基于原生JS的jsonp方法的实现

    基于原生JS的jsonp方法的实现 jsonp,相信大家并不陌生,是在js异步请求中解决跨域的方法之一,原理很简单,有不清楚的同学可以google下,这里就补详细解释了.在Jquery库中,jQuer ...

  2. Node.js返回JSONP

    在使用JQuery的Ajax从服务器请求数据或者向服务器发送数据时常常会遇到跨域无法请求的错误,常用的解决办法就是在Ajax中使用JSONP.基于安全性考虑,浏览器会存在同源策略,然而<scri ...

  3. 原生的js实现jsonp的跨域封装

    一.原理 jsonp是利用浏览器请求script文件时不受同源策略的限制而实现的,伪造一个script标签,将请求数据的url赋值给script的src属性,并将该标签添加到html中,浏览器会自动发 ...

  4. js借助JSONP实现百度搜索框提示效果

    主要借助百度搜索的API,调用时会存在跨域问题,需要通过JSONP来解决这个问题,代码如下(代码中部分使用ES6语法): HTML <input type="text" id ...

  5. 2-8 js基础 jsonp封装

    'use strict'; function jsonp(json){ json = json||{} if(!json.url)return; json.data=json.data||{}; js ...

  6. js 实现JSONP

    编写一个 jsonp.html 内容如下: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  7. 使用jsonp跨域调用百度js实现搜索框智能提示,并实现鼠标和键盘对弹出框里候选词的操作【附源码】

    项目中常常用到搜索,特别是导航类的网站.自己做关键字搜索不太现实,直接调用百度的是最好的选择.使用jquery.ajax的jsonp方法可以异域调用到百度的js并拿到返回值,当然$.getScript ...

  8. 用原生js来处理跨域的数据(jsonp)

    说明总结: 1.ajax和jsonp其实本质上是不同的东西.ajax的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加<script>标签来调用服务器提 ...

  9. 前端跨域问题相关知识详解(原生js和jquery两种方法实现jsonp跨域)

    1.同源策略 同源策略(Same origin policy),它是由Netscape提出的一个著名的安全策略.同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正 ...

随机推荐

  1. select多选

    1.css <style> .divBox{ width:400px; margin:100px auto; } .divBox span{ vertical-align:top; dis ...

  2. Java 8 (6) Stream 流 - 并行数据处理与性能

    在Java 7之前,并行处理集合非常麻烦.首先你要明确的把包含数据的数据结构分成若干子部分,然后你要把每个子部分分配一个独立的线程.然后,你需要在恰当的时候对他们进行同步来避免竞争,等待所有线程完成. ...

  3. Js onmouseover和onmouseout小特效

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  4. oa系统部署

    1.配置java环境变量 新建:JAVA_HOME C:\Program Files\Java\jdk1.6.0_45 path添加   C:\Program Files\Java\jdk1.6.0_ ...

  5. 初始MongoDB------将MongoDB创建为Windows服务

    上一遍我写的是关于基本的MongoDB的安装,可能不是很详细,也写得很不好,不过这次我们会详细的说说,如果将MongoDB部署在你的Windows电脑上. 1.配置环境变量 如果每次都要在CMD进入M ...

  6. Assembly之instruction之JC

    JC Jump if carry setJHS  Jump if higher or same Syntax JC label JHS label Operation If C = 1: PC + 2 ...

  7. Java 基础入门随笔(4) JavaSE版——程序流程控制

    上一节对于运算符有了大致的了解,这一节针对程序流程控制进行复习!程序流程控制包括顺序结构.判断结构(if).选择结构(switch).循环结构. 1.判断结构 ①if语句的第一种格式:        ...

  8. js实现字符串反转

    方案1: var str = "abcdef"; console.log( str.split("").reverse().join("") ...

  9. 07C语言程序语句

    C语言程序语句 判断语句 if(表达式) {语句} #include <stdio.h> int main(){ printf("请输入2个数字:"); int a,b ...

  10. Linux安装redis并且连接内网的redis

    1.安装redis步骤 1.首先准备工作  [root@10-100-14-130 ~]# yum install gcc-c++   yum install wget 2.推荐进入到linux路径/ ...