第一种方法是在ajax函数中设置dataType为'jsonp'

$.ajax({

        dataType: 'jsonp',

        url: 'http://www.a.com/user?id=123',

        success: function(data){

                //处理data数据

        }

});

第二种方法是利用getJSON来实现，只要在地址中加上callback=?参数即可

$.getJSON('http://www.a.com/user?id=123&callback=?', function(data){

        //处理data数据

});

第三种方法是使用getScript方法

//此时也可以在函数外定义foo方法

function foo(data){

        //处理data数据

}

$.getScript('http://www.a.com/user?id=123&callback=foo');

实例演练：

index.html

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>jsonp</title>

<script src="http://xvpindex.qiniudn.com/Static/Plugins/jquery/jquery-1.8.0.min.js"></script>

<script>

    $.ajax({

        type : "post",

        url : "http://www.topjui.com/jsonp.php?name=zhaoxiace&age=30",

        dataType : "jsonp",

        jsonp: "callbackParam",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)

        jsonpCallback:"callbackFunction",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名

        success : function(data){

            console.log(data.statusCode + "/" + data.message + "/" + data.name + "/" + data.age);

        },

        error:function(){

            alert('请求失败');

        }

    });

</script>

</head>

jsonp.php

<?

$data["age"] = $_GET['age'];

$data["name"] = $_GET['name'];

$data["statusCode"]="200";

$data["message"]="成功";

$tmp= json_encode($data); //json数据

echo $callback . '(' . $tmp .')';  //返回格式，必需

?>

jQuery中通过JSONP来跨域获取数据的三种方式的更多相关文章

  1. Struts2(四.注册时检查用户名是否存在及Action获取数据的三种方式)

    一.功能 1.用户注册页面 <%@ page language="java" contentType="text/html; charset=UTF-8" ...

  2. [ 转 ]jquery的ajax和getJson跨域获取json数据

    目前浏览器端跨域访问常用的两种方法有两种: 1.通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的. jsonp是英文json with padding的缩写.它允许在服务器端 ...

  3. jquery的ajax和getJson跨域获取json数据

    目前浏览器端跨域访问常用的两种方法有两种: 1.通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的. jsonp是英文json with padding的缩写.它允许在服务器端 ...

  4. jQuery之ajax的跨域获取数据

    如果获取的数据文件存放在远程服务器上(域名不同,也就是跨域获取数据),则需要使用jsonp类型.使用这种类型的话,会创建一个查询字符串参数 callback=? ,这个参数会加在请求的URL后面.服务 ...

  5. jsonp跨域获取数据小解

    jsonp跨域获取数据小解 由于浏览器有同源策略,所以要想获取非同源(协议,域名,端口三者有一不同都算非同源)的页面的数据,就得进行跨域 (1) jsonp原理 由于script标签的src属性可以访 ...

  6. 利用location.hash+iframe跨域获取数据详解

    前言 如果看懂了前文利用window.name+iframe跨域获取数据,那么此文也就很好理解了.一样都是动态插入一个iframe,然后把iframe的src指向服务端地址,而服务端同样都是输出一段j ...

  7. 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

  8. XMLHTTPRequest对象不能跨域获取数据？！

    写了一小段代码,是用XMLHTTPRequest对象来获取数据的,在本地服务器中,运行的很顺利,但是转向实际服务器(实质上就是转向http://gumball.wickedlysmart.com获取一 ...

  9. iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

随机推荐

  1. 【Datastage】Datastage在win10上安装报错：This Application requires one of the following versions of the .NET Framework:v1.1.4322 Do you want to install this .NET Framework version now？

    Datastage在win10上安装报错如下: 这个错误的意思是:.netFramWork的版本不符合要求,于是,我在网上下载了一个版本一致的 下载地址为:http://pan.baidu.com/s ...

  2. Java Learning Path（五）资源篇

    Java Learning Path(五)资源篇 1. http://java.sun.com/ (英文) Sun的Java网站,是一个应该经常去看的地方.不用多说. 2.http://www-900 ...

  3. JDBC技术总结（三）

    1. 数据库连接池 JDBC部分的前两个总结主要总结了一下JDBC的基本操作,而且有个共同点,就是应用程序都是直接获取数据库连接的.这会有个弊端:用户每次请求都需要向数据库获得连接,而数据库创建连接通 ...

  4. Docker: devicemapper fix for “device or resource busy” (EBUSY) Cannot start container

    受众:本文适用于熟悉码头工作的人员,并希望解决使用devicemapper存储/图形驱动程序时遇到的特定问题. 概述:虽然这不是专门用于设计师的问题,但是目前参与此驱动程序的技术人员会受到此影响. 使 ...

  5. 利用nginx搭建https服务器

    一.HTTPS简介 HTTPS其实是有两部分组成:HTTP + SSL / TLS,也就是在HTTP上又加了一层处理加密信息的模块.服务端和客户端的信息传输都会通过TLS进行加密,所以传输的数据都是加 ...

  6. tcpdump command

    工作中一直在用tcpdump,感觉非常方便,今天心血来潮百度了一下tcpdump的用法,才发现原来还有这么多强大的功能自己都不知道,那叫一个汗啊. 以此文作为备份,记录一些新知道的用法,各位网友谁有新 ...

  7. linux系统下面ftp的一些命令

    service vsftpd restart重启vsftpd服务service vsftpd stop停止vsftpd服务service vsftpd start启动vsftpd服务 chkconfi ...

  8. webuploader插件使用中的一点东西

    本人绝对菜鸟,高手勿喷 菜鸟开发中的解决方法,高手勿喷 1.针对同一应用中不同的类别,存放不同的路径 在页面中添加,hidden属性的标记,如:    type="hidden" ...

  9. gulp配置，实例演示

    项目完成后的目录 我们所需要的插件为:gulp-minify-css gulp-concat gulp-uglify gulp-rename del 如下图所示,完成后的项目目录结构: 附加,获取pa ...

  10. FP Tree算法原理总结（转载）

    FP Tree算法原理总结 在Apriori算法原理总结中,我们对Apriori算法的原理做了总结.作为一个挖掘频繁项集的算法,Apriori算法需要多次扫描数据,I/O是很大的瓶颈.为了解决这个问题 ...