我们现在www.test.com这个域名下面有这么个html文件testjsonp.html：
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" >
- <head>
- <title>Untitled Page</title>
- <script type="text/javascript" src="jquery-1.7.2.min.js"></script>
- <script type="text/javascript">
- jQuery(document).ready(function(){
- $.ajax({
- type: "GET",
- async: false,
- //url: "http://test/jsonp.php",
- url:"http://mytaobao.com/jsonp.php",
- dataType: "jsonp",
- jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)
- jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?"，jQuery会自动为你处理数据
- success: function(json){
- alert('您查询到航班信息：票价： ' + json.price + ' 元，余票： ' + json.tickets + ' 张。回调函数名为: '+json.func);
- },
- error: function(){
- alert("fail");
- }
- });
- });
- </script>
- </head>
- <body>
- </body>
- </html>
注意，要真正运行上面的代码可能需要jquery的文件，你可以将<script type="text/javascript" src="jquery-1.7.2.min.js"></script>改为你目录中jquery的文件路径：
如：<script type="text/javascript" src="js/jquery.js"></script>
然后，你可以再找个另外一个域名的web目录，将文件jsonp.php:
- <?php
- $callback = $_GET["callback"];
- $a = array(
- 'code'=>'CA1998',
- 'price'=>'6000',
- 'tickets'=>20,
- 'func'=>$callback,
- );
- $result = json_encode($a);
- echo "flightHandler($result)";
- exit;
放到这个目录下面去。这样就可以测试了。
直接在浏览器访问testjsonp.html.就可以看到效果了。
相关推荐
在Web开发中，跨域（Cross-Origin）是一个常见的问题，由于浏览器的安全策略限制，JavaScript通常不能直接访问不同源（协议+域名+端口）的资源。然而，为了实现某些功能，比如用户登录、数据获取等，我们需要打破这...
在本例中，我们将探讨如何通过JSONP来解决JavaScript的跨域问题，以及PHP作为服务器端语言如何配合JSONP工作。 一、理解JSONP 1. 同源策略：浏览器默认实施的一种安全策略，只允许JavaScript访问与当前页面同源...
JSONP（JSON with Padding）是一种常见的解决浏览器同源策略限制的跨域数据交互方式，尤其在JavaScript中广泛使用。在本项目"JSONP跨域实现百度搜索功能(v1.0.0)"中，我们将深入探讨如何利用JSONP技术来实现在网页上...
【JSONP跨域原理】 JSONP（JSON with Padding）是一种跨域数据交互协议，它的基本思想是利用浏览器允许 `<script>` 标签加载不同源的脚本这一特性，通过动态创建 `<script>` 标签并设置其 `src` 属性来发起请求。...
ajax jsonp跨域传参，里面有源码，不过写在txt中了，很适合调用别人的接口
Ajax JSONP跨域处理是Web开发中的重要技术，通过JSONP，开发者可以在不违反同源策略的前提下实现跨域数据交互。虽然JSONP存在一些限制和安全隐患，但在许多场景下，它仍然是一个实用且有效的解决方案。随着技术的...
在JavaScript的世界里，由于同源策略的限制，浏览器禁止了不同源之间进行AJAX通信，但JSONP（JSON with Padding）作为一种巧妙的方式，允许我们绕过这个限制，实现在jQuery中进行跨域请求。本篇文章将深入探讨JSONP...
这种方法主要用于解决现代浏览器中的跨域数据访问问题，因为JSONP不受同源策略的限制。 在JSONP的工作原理中，前端通过动态创建`<script>`标签并设置`src`属性指向服务端的API接口。这个接口应该设计为接收一个特定...
### JSONP 跨域请求数据实现手机号码查询实例分析 #### 前言 在现代Web开发中，跨域问题一直是前端开发者面临的一个常见难题。简单来说，由于浏览器的同源策略限制，当一个网页尝试从不同的源（即不同的协议、端口...
在给定文件中，我们看到了一段使用JSONP方法实现跨域获取数据的JavaScript代码实例及其在HTML页面中的应用。首先，我们定义了一个名为`jsonp`的函数，用于封装JSONP请求的过程。这个函数接收三个参数：`url`（请求的...
在标题“JS 使用 JSONP 跨域获取用户IP”中，我们可以理解为这个示例将展示如何利用JSONP技术来解决浏览器的同源策略限制，从而获取到用户的IP地址。这在某些场景下非常有用，比如分析用户地理位置、提供个性化服务...
PHP AJAX JSONP 实现跨域请求使用实例 在 Web 开发中，跨域请求是指从一个域名下的页面请求另一个域名下的资源，这种情况下，浏览器会限制这种请求，以防止恶意攻击。JSONP（JSON with Padding）是一种解决跨域请求...
今天研究了AJAX使用JSONP进行跨域调用的方法，发现使用GET方式和POST方式都可以进行跨域调用,这里简单分享下，方便需要的朋友
本文将详细探讨JSONP的工作原理以及如何在实际项目中使用它来跨域获取JSON数据。 ### JSONP简介 JSONP全称为"JSON Padding"，它并不是JSON的一种新格式，而是一种利用动态创建`<script>`标签来绕过同源策略的技巧...
【ASP.NET JSONP 实现 jQuery 跨域】 在 Web 开发中，由于浏览器的同源策略限制，JavaScript 无法直接跨域访问数据。为了解决这个问题，开发者常常使用 JSONP(JSON with Padding) 技术。ASP.NET 和 jQuery 结合使用...
在Web开发中，跨域（Cross-Origin）是一个常见的问题，特别是在使用Ajax进行异步数据交互时。跨域限制是浏览器为了安全原因而设置的一种机制，防止恶意网站通过脚本访问其他站点的数据。本文将深入探讨两种主要的...
在JavaScript的世界里，跨域（Cross-Origin）是一个常见的问题，特别是在AJAX请求中。由于同源策略的限制，浏览器不允许JavaScript脚本从一个域名访问另一个域名的数据，这为跨域数据交互带来了挑战。JSONP（JSON ...
原生JS封装Ajax插件(同域、jsonp跨域)_.docx