EasyUi學習
首先到http://www.w3cschool.cc/jeasyui/jqueryeasyui-tutorial.html 下载了手册。
再到 http://edu.51cto.com/course/course_id-1300.html 点击学习
第一课 2014.12.27
jQuery EasyUi入门
到百度下载 插件包 解压放入站点目录 官方网站：http://www.jeasyui.com/ 外国站点慢
特点：1 基于jQuery
2.支持html5
3.源代码加密，商业版付费499美元
适合做后台,属于比较重的框架 内置jQuery2.0版本，不支持IE9.0以下版本。（IE6，7，8）
同类产品 DWZ; ExtJS
demo 样例，可以全部删除
themes 主题(外观)，可以删除
locale 语言包 可以删除中文以外的文件
3. 实例 弹出一个对话框，可以移动，可以最小化
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic Dialog - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"><!-- 默认主题中总样式表-->
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"><!-- 默认各种图标-->
<link rel="stylesheet" type="text/css" href="easyui/demo/demo.css">
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="easyui/jquery.min.js"></script> <!--载入jQuery 主核心文件2.0不支持IE6,7,8-->
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="easyui/jquery.easyui.min.js"></script><!--载入Easyui主核心文件-->
<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="easyui/locale/easyui-lang-zh_cn.js"></script> <!--载入语言包-->
</head>
<body>
<!--div class ="easyui-dialog"
data-options="title:'我的窗口' ,collapsible:true ,iconCls:'icon-ok',onopen;function(){}">
对话内容. </div-->
<h2>基本弹出窗口</h2>
<p>点击下面的按钮来打开或关闭对话框。</p>
<div >
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#dlg').dialog('Open')">开打</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#dlg').dialog('Close')">关闭</a>
</div>
<div id="dlg" class="easyui-dialog" title="基本对话框" data-options="iconCls:'icon-save' ,collapsible:true " >
对话内容
</div>
</body>
</html>
第一课结束
共同學習，寫下你的評論
評論加載中...
作者其他優質文章
