<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>AJAX</title> </head> <body> <script src="https://www.jb51.net/js/jQuery1.11.3/jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> $.get("http://localhost:8087/JavaScript001/Product?act=getAllCORS",function(data){ alert(data); }); </script> </body> </html>
运行结果：
2.4、CORS跨域的问题
a)、如果认为每次需要修改HTTP头部比较麻烦，在java中可以使用过滤器，.Net可以使用Module或HttpHandler全局注册（注册到Web.Config中，部署时还需要注意）。
b)、如果需要考虑IE8实现CORS则要插件支持，因为IE8并没有完全支持CORS。
插件名称：javascript-jquery-transport-xdr
github：
示例代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>AJAX</title> </head> <body> <script src="https://www.jb51.net/js/jQuery1.11.3/jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script> <!--[if (IE 8)|(IE 9)]> <script src="https://www.jb51.net/js/jquery.transport.xdr.min.js" type="text/javascript" charset="utf-8"></script> <![endif]--> <script type="text/javascript"> $.get("http://localhost:8087/JavaScript001/Product?act=getAllCORS&type=meat-and-filler&format=json",{},function(data){ alert(data); },"json"); </script> </body> </html>
运行结果：
c)、Apache官方提供一个支持CORS跨域的过滤器，详细说明：
3.5、小结
当然除了兼容老浏览器的jsonp跨域与HTML5中的CORS跨域还有很多其它办法如利用iframe和location.hash、window.name实现的跨域数据传输、使用HTML5 postMessage、利用flash等办法。个人认为CORS应该才是未来主要的跨域选择，其它的方法都只是hack。
四、弹出层
前面AJAX示例中添加功能如果放在一个弹出层中布局会更加紧凑一些，像登录，提示信息经常会需要弹出层。
常见的弹出层有：FancyBox，LightBox，colorBox，artDialog，BlockUI，Layer等，这里介绍腾讯开源的artDialog，轻量，实用。
artDialog是一个设计得十分巧妙的对话框组件，小巧身材却拥有丰富的接口与漂亮的外观。
特点是自适应内容、优雅的接口、细致的体验、跨平台兼容、轻量实用。
项目源码： https://github.com/aui/artDialog
AngularJS 版本： https://github.com/aui/angular-popups
使用方法：