标签:引用 更新 ddc 单元 html 判断 res check process
easyui
是一种基于 jQuery
的用户界面插件集合。
easyui
为创建现代化,互动,JavaScript 应用程序,提供必要的功能。
使用 easyui
你不需要写很多代码,你只需要通过编写一些简单 HTML 标记,就可以定义用户界面。
easyui
是个完美支持 HTML5 网页的完整框架。
easyui
节省您网页开发的时间和规模。
easyui
很简单但功能强大的。
官网地址:http://www.jeasyui.com/index.php
文档地址:
第一步: 下载 Jquery EasyUI
你在使用和进行开发时,请遵守官方相应的条款,尊重他们的知识版权。
目前官方最新版本是:jQuery EasyUI 1.5,官方提供了两个版本供下载,GPL 版本和商业版本,你根据自己的需要下载
第二步:创建 html 文件,并添加相关引用
创建项目的文件夹
easydemo // 项目根目录
├── index.html // 我们的测试页面
└── lib // 第三方组件
└── jquery-easyui-1.5.5.2 // 下载的easyui的压缩包解压后的文件夹
├── easyloader.js // easyui的动态加载组件的js
├── jquery.easyui.min.js // 压缩后的包!!!关键!!
├── jquery.easyui.mobile.js
├── jquery.min.js // 依赖的jq的文件
├── locale // 本地语言的文件夹
├── plugins // 拆分的组件
└── themes // 样式主题文件夹
第三步: 修改 index.html 文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!-- easyui的样式,可以选择其他主题 -->
<link rel="stylesheet" href="./lib/jquery-easyui-1.5.5.2/themes/bootstrap/easyui.css">
<!-- easyui的图标css文件 -->
<link rel="stylesheet" href="./lib/jquery-easyui-1.5.5.2/themes/icon.css">
<!-- easyui 依赖jq -->
<script src="./lib/jquery-easyui-1.5.5.2/jquery.min.js"></script>
<!-- jq easyui的js脚本 -->
<script src="./lib/jquery-easyui-1.5.5.2/jquery.easyui.min.js"></script>
<!-- 引用语言包 -->
<script src="./lib/jquery-easyui-1.5.5.2/locale/easyui-lang-zh_CN.js"></script>
<title>AICODER jQuery EasyUI Demos</title>
</head>
<body>
<!-- 功能:点击按钮弹出模态对话框 -->
<input type="button" value="弹出模态对话框" id="btnOpenDialog">
<!-- 设置弹出来的对话框div,首先设置为隐藏 -->
<div id="addDialog" style="display: none;">
<h3>添加的对话框</h3>
</div>
<script>
$(function () {
$(‘#btnOpenDialog‘).on(‘click‘, function () {
// 弹出对话框
$(‘#addDialog‘).dialog({
modal: true, // 是否是模态对话框
title: ‘AICODER全栈实习--添加用户!‘, // 弹出来的窗口的标题
width: 400, // 窗口的宽度
height: 400, // 窗口的高度
});
});