`
jsj_064
  • 浏览: 9355 次
  • 性别: Icon_minigender_1
  • 来自: 宣城
最近访客 更多访客>>
社区版块
存档分类
最新评论

jQuery的JSONP的写法,相当简单

阅读更多
转自http://pldream.com/b/?post=72
jQuery对JSONP的支持还是相当不错的,主要有三种方法

$.getJSON
$.ajax
$.get

三种方法基本上大同小异。现在就以$.get为例

服务器端代码为:

	date_default_timezone_set('Asia/Shanghai');
	$time = date('Y-m-d H:i:s', time());
	$arr = array('name'=>urldecode($_GET['name']), 'time'=>$time);
	echo $_GET['callback'] . '(' . json_encode($arr) . ')';

一句就可以搞定了,跟普通的ajax的写法一样

$.get(_url, {name: encodeURIComponent('张三')}, function (json) {
	alert(json.name + ' : ' + json.time);
}, 'jsonp');

另外两种也贴上

function callJSONP2 (_url) {
	$.ajax(
	{
		url: _url + '?name=张三',
		dataType: 'jsonp',
		jsonp: 'callback',
		success: function (json) {
			$.each(json, function (k, v) {
				alert(k + ':' + v);
			});
		}
	});
}


function callJSONP3 (_url) {
	$.getJSON(_url + '?callback=?', {name: '张三'}, function (json) {
		$.each(json, function (k, v) {
			alert(k + ':' + v);
		});
	});
}
分享到:
评论

相关推荐

    jsonp格式前端发送和后台接受写法的代码详解.docx

    - 设置`dataType`为`jsonp`告诉jQuery使用JSONP方式进行请求。 - 请求成功后,通过`success`回调函数处理数据。 ##### 2. 后台接收示例(Python Django框架) ```python from django.shortcuts import render, ...

    ThinkPHP+Jquery手册

    3. **事件处理**:jQuery统一了事件处理函数的写法,支持事件绑定和解绑,还有事件冒泡和阻止默认行为等功能。 4. **动画效果**:提供滑动、淡入淡出、动画队列等丰富的动画效果,使页面交互更加生动。 5. **Ajax...

    jQueryPost页面不能刷新

    正确的写法是: ```javascript jQuery.post(url, { "friends.friendUser.acct": acct }, function(result) { document.getElementById("light").innerHTML = result; }); ``` 这里有几个关键知识点: 1. **jQuery...

    jquery-1.1.3 效率提高800%

    在jQuery 1.2版本中,如果你指明了一个JSONP回调函数,你就可以从其它的域中载入JSON类型的数据,写法类似于 "myurl?callback=?" 。jQuery会自动调用正确的方法名称来代替查询字符串,执行你指定的回调函数。...

    22.3 jQuery 库

    2. **DOM操作**:jQuery 提供了一系列方法用于操作DOM,如`append()`、`prepend()`、`html()`、`text()`等,它们使插入、删除和修改HTML内容变得简单。 3. **事件处理**:jQuery 通过`.on()`方法统一处理事件绑定,...

    jquery-1.4.2.min.js

    同时,jQuery还提供了异步请求的$.ajax()方法,用于处理XMLHttpRequest,支持JSONP、AJAX跨域等复杂需求。 在DOM操作上,jQuery提供了一系列便利的方法,如`.append()`, `.prepend()`, `.before()`, `.after()`,...

    jquery最新包

    5. **Ajax交互**:`$.ajax()`, `$.get()`, `$.post()`等函数,让异步数据请求变得简单,支持JSONP,使得跨域数据请求成为可能。 6. **链式操作**:jQuery的一个显著特征是链式操作,如`$("#element").css("color", ...

    jquery中ajax处理跨域的三大方式

    在客户端,通过设置$.ajax请求的dataType为'jsonp',jQuery会创建一个script标签并将其追加到document的中,向指定的跨域URL发起请求。在服务端,需要将返回的内容包装在一个调用前端定义好的回调函数中。例如,如果...

    快速解决跨域请求问题:jsonp和CORS

    主要介绍了快速解决跨域请求问题:jsonp和CORS,涉及jsonp和CORS的介绍,分享了前端 jQuery 写法,后端 SpringMVC 配置,后端非 SpringMVC 配置等相关内容,具有一定借鉴价值,需要的朋友可以参考下。

    比较完整的原始ajax写法

    标题中的“比较完整的原始ajax写法”指的是在JavaScript中实现异步XMLHttpRequest(Ajax)通信的基本方法,不依赖任何库或框架,如jQuery、axios等。这种原生的Ajax技术对于理解网络请求的工作原理至关重要。 在...

    yjQuery1.2API.7z

    6. **链式调用**:jQuery的一大特性是链式调用,如`$("#element").addClass("highlight").show()`,这种写法提高了代码的可读性和效率。 `otand.com源动力下载说明.txt`可能是一份关于如何下载和使用jQuery1.2API....

    js代码-兼容性写法

    9. **跨域问题**:在IE8及以下,`XMLHttpRequest`的CORS支持有限,需要通过`document.domain`设置或使用`JSONP`来解决跨域请求。 10. **异常处理**:IE对try/catch的错误对象处理与标准浏览器有所不同,`error`对象...

    jquery中邮箱地址 URL网站地址正则验证实例代码

    综上所述,通过对jQuery中邮箱地址和URL网站地址的正则验证实例代码的深入分析,可以了解到邮箱和URL地址的正则表达式写法、JavaScript与HTML元素的交互方法、JavaScript正则验证方法、数组处理、Ajax请求以及错误...

    AngularJS中$http的交互问题

    这篇文章,主要是通过我们熟悉的jquery中ajax和jsonp的类型方式,总结一下$http的使用。 $http 是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。 1. angular中的ajax 写法一: $http({ method: 'GET',...

    输入框自动联想提示

    jsonp: 'callback', //设置此参数名,将开启jsonp跨域功能(我要调淘宝数据,非跨域不可,淘宝的回调参数名就是callback),否则使用json数据结构 item: 'li', //下拉提示项目单位的选择器,默认一个li是一条提示,...

    javascript面试题汇总.pdf

    例如,在IE和其他标准浏览器中获取事件对象的方式不同,以及获取页面元素尺寸的兼容性写法。 6. **异步请求方式GET与POST:** GET方式将请求参数追加到URL后面,而POST方式则是将数据放在请求体中发送。GET请求有...

    实验室

    6. **Promise和async/await**:Promise是处理异步操作的一种方式,而async/await是Promise的高级用法,使得异步代码更接近同步写法,易于理解和维护。 7. **JavaScript框架和库**:React、Vue、Angular是当前流行的...

    JavaScript_Project:我的网站项目

    11. **Promise和async/await**:Promise是处理异步操作的工具,而async/await则是Promise的语法糖,使得异步代码更接近同步代码的写法,降低了理解和调试的难度。 12. **JavaScript框架和库**:在实际开发中,常常...

    MayCode

    14. **跨域问题**:由于同源策略的限制,JavaScript在不同源之间进行通信会受到限制,通过JSONP、CORS或代理服务器等方式可以解决跨域问题。 15. **测试与调试**:单元测试工具有Jest、Mocha,调试工具如Chrome ...

Global site tag (gtag.js) - Google Analytics