标签:
JSONP的实现思路很简单
接口
|
1
2
3
4
5
|
Sjax.load( url, // 跨越请求的URL success, // 回调函数,必须定义一个形参,用于接收后台返回的全局变量jsonp (约定后台返回如jsonp = {...}结构) timestamp, // 传true会加一个时间戳,防止缓存,默认不加); |
示例:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<!DOCTYPE HTML><html><head> <meta charset="utf-8"> <title>sjax_0.1.js by snandy</title></head><body><p id="p1" style="background:gold;"></p><input type="button" value="Get Name" onclick="clk()"/><script type="text/javascript"> function clk(){ Sjax.load( function(){ document.getElementById(‘p1‘).innerHTML = ‘Hi, ‘ + jsonp.name; } ); }</script></body></html> |
这个html实现一个最简单的前后台交互功能,点击按钮“Get Name”,获取到name后显示在段落P上。
clk函数中调用Sjax.load方法,Sjax中的S指script。之前我的Ajax系列中使用的Ajax命名,这里就使用了Sjax。
请求的后台url是jsonp.js,它返回如下
|
1
|
jsonp = {name:‘jack‘}; |
因为是测试,这里使用最简单的方式实现。请求的后台其实不必是js文件,可以是php,java等任何后台语言,它们可能会连接数据库进行一系列的业务查询。总之它最后返回的结构必须变量jsonp,这个变量就是一个js对象,至于有多复杂则无需关注。
标签:
原文地址:http://www.cnblogs.com/Arther-J/p/5455655.html