easyUI解决jsonp跨域问题

html代码:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>js渲染表格</title>
    <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../../themes/icon.css">
    <script type="text/javascript" src="../../js/jquery.min.js"></script>
    <script type="text/javascript" src="../../js/jquery.easyui.min.js"></script>
    <script src="myScript.js"></script>
</head>
<body>
    <table id="dg" class="easyui-datagrid"></table>
</body>
</html>

js代码:

$(function () {
    $("#dg").datagrid({
        loader:function(param,success,error){
            //跨域请求数据
            $.ajax({
                async:false,
                url:"http://192.168.1.106:8080/easyUI/db.php",
                type:"get",
                dataType:"jsonp",
                jsonp:"callback",
                jsonpCallback:"callback",
                success: function (res) {
                    success(res);
                },
                error: function (xhr) {
                    error(xhr.responseText);
                }
            })
        },
        width:400,
        title:"用户列表",
        iconCls:"icon-search",
        //两个数组是为了合并单元格
        columns:[[
            {title:"姓名",field:"name"},
            {title:"年龄",field:"age"},
            {title:"邮箱",field:"email"}
        ]]

    })
})

在loader函数里,可以使用ajax获取数据,将数据传给success函数渲染到表格上。

数据格式:

显示结果:

解决easyUI跨域问题_jsonp