第一种方法是在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. 2015级C++第7周项目 友元、共享数据保护、多文件结构

    [项目1-成员函数.友元函数和一般函数有差别]參考解答 (1)阅读以下的程序,体会凝视中的说明(要执行程序,请找到课程主页并复制代码) //例:使用成员函数.友元函数和一般函数的差别 #include ...

  2. 基于JWT的Token开发案例

    代码地址如下:http://www.demodashi.com/demo/12531.html 0.准备工作 0-1运行环境 jdk1.8 maven 一个能支持以上两者的代码编辑器,作者使用的是ID ...

  3. Android 应用程序分析

    从这点上看,android应用程序实际上是由多个Activity按照一定的次序拼装起来的, 只不过拼装的过程中,后台传递了一些数据,使得各个Activity之间能比较好的衔接起来.     在 and ...

  4. Delphi里J+开关作用类似C语言的static变量

    從前筆者曾經對以下的程式產生過疑惑:{$J+}procedure TForm1.Button1Click(Sender: TObject);const  VarConst: integer = 4;b ...

  5. MQTT--linux安装部署(CentOS)

    OS环境:CentOS6.5 1.安装依赖 yum -y install gcc gcc-c++ openssl-devel c-ares-devel libuuid-devel wget cmake ...

  6. [LeetCode]Palindrome Number 推断二进制和十进制是否为回文

    class Solution { public: bool isPalindrome2(int x) {//二进制 int num=1,len=1,t=x>>1; while(t){ nu ...

  7. PHP-Manual的学习----【安装与配置】

    2017年6月27日17:59:16 安装与配置    安装前需要考虑的事项    Unix系统下的安装    Mac OS x系统下的安装    windows 系统下的安装    云计算平台上的安 ...

  8. Root(hdu5777+扩展欧几里得+原根)

    Root                                                                          Time Limit: 30000/1500 ...

  9. 自定义tabpageindicator,可以自定义tab是三角形还是矩形,但是tab不具有滑动的功能

    我是不会滴,但是看了一些大神写的,我修改了一下,大家可以参照参照 一,自定义Mytabpageindicator,直接贴代码了,具体的在代码中有注释 package com.wangy.mytabpa ...

  10. [学英语]vocabulary.com你都可以怎么用

    vocabulary.com你都可以怎么用? 核心就是背单词. 1.利用纯英文环境熟悉单词,看看他们是如何解释单词的. 2.对于大段的文章,可以提炼出你需要背的单词. 3.以游戏的方式来背单词,app ...