01.后台前端引入jQuery Easy UI

最新推荐文章于 2019-02-17 16:50:20 发布

skyandairchild

最新推荐文章于 2019-02-17 16:50:20 发布

阅读量831

点赞数

分类专栏： jQueryEasyUI 文章标签： jquery ui 前端

本文链接：https://blog.csdn.net/skyandairchild/article/details/69808814

版权

jQueryEasyUI 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

jQuery Easy UI同类产品
引入jQuery Easy UI的demo
引入easyloadjs智能加载所需的模块化组件不推荐

1. jQuery Easy UI同类产品

1. jQuery UI 适用于轻应用，如网页前端
2. jQuery Easy UI 比较重适用于后台前端
3. ExtJS 更重，非jQuery的独立UI。
4. DWZ 国产，也是基于jQuery的UI

2. 引入jQuery Easy UI的demo

    <!DOCTYPE html>
<html lang="zh-ch">
<head>
    <meta charset="UTF-8">
    <title>jQuery Easy UI 包引入</title>
    <link rel="stylesheet" href="css/themes/default/easyui.css">
    <link rel="stylesheet" href="css/themes/icon.css">
    <link rel="stylesheet" href="css/themes/color.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>
<body>
    <div class="easyui-dialog" style="width:400px;height:200px"
    data-options="
        title:'My Dialog',
        iconCls:'icon-ok',
        onOpen:function(){}">
    dialog content.
</div>
</body>
</html>

3. 引入easyload.js智能加载所需的模块化组件(不推荐）

引入easyload.js智能加载模块组件，需要把themes和plugins文件夹放在easyload.js同个目录下，代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>easyloader 智能加载</title>
    <script type="text/javascript" src="easyUI/jquery.min.js"></script>
    <script type="text/javascript" src="easyUI/easyloader.js"></script>
    <script type="text/javascript">
        $(function(){
            /*有多个组件可用数组的方式加载dialog等*/
            easyloader.load('dialog',function(){
                $('#mydialog').dialog();
            });

        });
    </script>

</head>
<body>


    <div id="mydialog">
        dialog content.
    </div>
</body>
</html>