jqueryEasyUI datagrid 跨域获取数据。
2015-09-08 23:18
921 查看
一般情况下,在用jquery easyUI中的datagrid展示数据时,url属性值是必须要本地链接而且数据为json格式。在日常的工作中,可能会有需要通过URL接口去读取别人的json数据,然后就会存在跨域的问题。其实在jquery中大家都知道可以通过jsonp去解决跨域问题,而jqueryEasyUI又是基于jquery,所以修改一下jqueryEasyUI源文件其实就可以了,最直接的就是多加一个ajax。然后做个判断区分json和jsonp时执行哪一个ajax。具体看一下下面,大家应该就知道了。
jquery.easyui.min.js(1.4.3版本)
html
相应的地方可以按自己的需要修改,比如callback等等。
jquery.easyui.min.js(1.4.3版本)
html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Basic DataGrid - jQuery EasyUI Demo</title> <link rel="stylesheet" type="text/css" href="JqueryEasyUI/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="JqueryEasyUI/themes/icon.css"> <script type="text/javascript" src="JqueryEasyUI/jquery.min.js"></script> <script type="text/javascript" src="JqueryEasyUI/jquery.easyui.min.js"></script> <script> $(function(){ $('#test').datagrid({ title:'My DataGrid', width:800, height:350, nowrap: true, autoRowHeight: false, striped: false, collapsible:true, remoteSort: false, pagination:true, rownumbers:true, fitColumns:true, <span style="color:#CC0000;">jsonp:true,//添加的一个属性,作判断用,对应看一下上图的if</span> url:"http://localhost:8080/Test_20150906/test.action", method:'get' }); var p = $('#test').datagrid('getPager'); $(p).pagination({ onBeforeRefresh:function(){ alert('before refresh'); } }); }); </script> </head> <body> <h2>Basic DataGrid</h2> <p>The DataGrid is created from markup, no JavaScript code needed.</p> <div style="margin:20px 0;"></div> <table id="test" cellspacing="0" cellpadding="0"> <thead> <tr> <th field="password" width="100">部门</th> </tr> </thead> </table> </body> </html>
相应的地方可以按自己的需要修改,比如callback等等。
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- JavaScript演示排序算法
- 2015-2016网页设计趋势分析 Web Design of Trends
- jQuery Ajax 跨域调用
- 移动端的长按事件
- jquery教程靠边站,一分钱不花让你免费学会jquery
- JQuery+Strusts1.x无刷新登录
- XML 与 JSON 优劣对比
- 解决Ajax悬停效果,无法遮蔽FLASH的问题
- 再谈Jquery Ajax方法传递到action(补充)
- jQuery菜单插件用法实例
- JQuery 初体验(建议学习jquery)
- Jquery实现的table最后一行添加样式的代码
- jQuery实现向下滑出的平滑下拉菜单效果
- jQuery 练习[一] 学习jquery的准备工作
- jquery获得页面元素的坐标值实现思路及代码
- 使用Browserify配合jQuery进行编程的超级指南
- jquery如何实现在加载完iframe的内容后再进行操作
- jquery $.ajax()取xml数据的小问题解决方法
- jQuery '行 4954 错误: 不支持该属性或方法' 的问题解决方法