一、jsonP
jsonP,客户端浏览器不允许跨域访问,当服务器的协议、地址、端口号有一个不同时,即为跨域。jsonP是json Padding的缩写,Padding可理解为后缀或者是填充。jsonP的重要特殊是具有一个回调函数,回调函数是调用者调用被调用域服务的标记,callback运行在被调用域服务器上。jQuery支持jsonP,语法如下:
jQuery.getJSON("http://www.yourdomain.com/jsonp/ticker?symbol=IBM&callback=?",
function(data) {
alert("Symbol: " + data.symbol + ", Price: " + data.price);
});
?为回调函数名,默认为callback;
还可以使用Ajax实现,语法如下:
$.ajax({
url:"http://localhost:20002/MyService.ashx?callback=?",
dataType:"jsonp",
jsonpCallback:"person",
success:function(data){
alert(data.name + " is a a" + data.sex);
}
});
《使用 JSONP 实现跨域通信,第 1 部分: 结合 JSONP 和 jQuery 快速构建强大的 mashup》还给出了servlet实现,如下:
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
String jsonData = getDataAsJson(req.getParameter("symbol"));
String output = req.getParameter("callback") + "(" + jsonData + ");";
resp.setContentType("text/javascript");
PrintWriter out = resp.getWriter();
out.println(output);
// prints: jsonp1232617941775({"symbol" : "IBM", "price" : "91.42"});
}
另外两篇参考文章,分别是:
我的一篇博文《json接口格式实现》和《深入理解jsonP》,jsonP的缺点是存在安全问题(客户端执行回调)和执行失败无提示。
二、Ajax
Ajax即为异步的js和xml,由html、css、js、xml、xmlHtppRequest等组成,除XmlHttpRequest以外,其他技术都是已熟的web标准技术。Ajax的优点有:1.异动请求;2.局部刷新;3.按需取数;缺点有:破坏浏览器的回退按钮行为;2.使用js作为驱动引擎,需考虑js兼容性和debug等。
Ajax的三个优点可以让页面更加丰富,交互更加自由,用户体现更佳,jQuery通过$.ajax提供了丰富的ajax功能,$.ajax的常用参数有data、type、success、beforesend、url、async等等。
$.ajax({
async: false,
url : '../dependence/queryPost.action',
success : function(result) {
var jobList = result.staffinfoVo.jobList;
if(jobList != null && $("option", post).length<1){
post.append('<option value="">-请选择-</option>');
$.each(jobList, function(i,item){
if(item.active=="Y"){
post.append('<option value="'+ item.jobCode +'">'+item.jobName+'</option>').val(val);
}
});
}
}
});
参考:
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。