jqueryEasyUI datagrid 跨域获取数据。

来源：互联网发布：nba2k17欧文捏脸数据编辑：程序博客网时间：2024/05/23 19:17

一般情况下，在用jquery easyUI中的datagrid展示数据时，url属性值是必须要本地链接而且数据为json格式。在日常的工作中，可能会有需要通过URL接口去读取别人的json数据，然后就会存在跨域的问题。其实在jquery中大家都知道可以通过jsonp去解决跨域问题，而jqueryEasyUI又是基于jquery，所以修改一下jqueryEasyUI源文件其实就可以了，最直接的就是多加一个ajax。然后做个判断区分json和jsonp时执行哪一个ajax。具体看一下下面，大家应该就知道了。

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等等。

0 0