EasyUI Datagrid数据网格初学习，如何使用url导入json数据及踩雷（一）

最新推荐文章于 2026-08-05 15:45:00 发布

原创

最新推荐文章于 2026-08-05 15:45:00 发布 · 559 阅读

收录于

当前文章被以下社区和专栏收录：

本文介绍了如何在EasyUI中使用Datagrid通过URL导入JSON数据，强调了jQuery库与EasyUI库的正确引入顺序，以及JSON数据格式的编写规则。在实践中要注意CSS和JS文件的引入，否则可能导致样式缺失或错误。

第一步：创建一个页面，代码如下

<html>
    <head>
        <title>数据网格测试</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="../../easyui/themes/default/easyui.css">
        <link rel="stylesheet" href="../../easyui/themes/icon.css">
        <script src="../../jquery.js"></script>
        <script src="../../easyui/jquery.easyui.min.js"></script>
        <script src="../../easyui/jquery.easyui.mobile.js"></script>
        <script src="../../easyui/easyloader.js"></script>
    </head>
    <body>
        <table id="dg"></table>
        <script>
            $('#dg').datagrid({
                url:"datagrid.json",
                columns:[[
                    {field:'begin',title:'起点',width:150,align:'center'},  
                    {field:'startime',title:'计划开始时间',width:150,align:'center'},
                    {field:'endtime',title:'计划结束时间',wid

标签