【原】jQuery easyUI 快速搭建前端框架-低调大师

【原】jQuery easyUI 快速搭建前端框架

2018-06-21 575

jQueryEasyUI

jQuery EasyUI是一组基于jQuery的UI插件集合体，而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript，也不需要对css样式有深入的了解，开发者需要了解的只有一些简单的html标签。

这里我们使用easyUI搭建一个简单的页面框架，非常简单！

效果如此：

需要引入的最少的文件

3个js文件是必须的

文件下载链接：http://www.jeasyui.net/download/

注意：easyui从1.2.3版本之后开始收费了

创建一个html：

引入js以及要用到的样式

注意，由于ezUI是依赖jQuery的，所以引用的顺序一定是jQuery的js在easyUI的js之前！！！

demo1_layout.html:

<!DOCTYPE HTML>
<html>
	<head>
		<title>demo layout</title>
		<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
		<script type="text/javascript" src="jquery.easyui.min.js"></script>
		<script type="text/javascript" src="easyui-lang-zh_CN.js"></script>
		<link rel="stylesheet" type="text/css" href="themes/icon.css"></link>
		<link rel="stylesheet" type="text/css" href="themes/default/easyui.css"></link>
	</head>
	<body>

	</body>
</html>

　　（从我的路径可以看出，我的html文件和jQuery的js是平级关系）

完整代码：

<!DOCTYPE HTML>
<html>
	<head>
		<title>demo layout</title>
		<!-- 引入jQuery的js -->
		<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
		<!-- 引入jQuery easyUI的js -->
		<script type="text/javascript" src="jquery.easyui.min.js"></script>
		<!-- 引入 国际化的js -->
		<script type="text/javascript" src="easyui-lang-zh_CN.js"></script>
		<!-- 引入图片样式 -->
		<link rel="stylesheet" type="text/css" href="themes/icon.css"></link>
		<!-- 引入默认样式 -->
		<link rel="stylesheet" type="text/css" href="themes/default/easyui.css"></link>
	</head>
	<body>
		<!-- 使用easyui的layout布局 -->
		<div class="easyui-layout" data-options="fit:true">
			<!-- easyui在data-options配置配置 -->
			<!-- 只有center区域是必须的 -->
			<div data-options="region:'east',title:'东部'" style="width:200px;">东部</div>
			<div data-options="region:'west',title:'西部'" style="width:200px;">
				<!-- 可折叠面板accordion -->
				<!-- fit 属性，使得当前div大小占满 父容器 -->
				<div class="easyui-accordion" data-options="fit:true">
					<!-- 每一个div就是一个面板 -->
					<!-- 通过iconCls设置图标，找icon.css中定义的类 -->
					<div data-options="title:'基本功能',iconCls:'icon-mini-add'">可折叠面板1</div>
					<div data-options="title:'高级功能',iconCls:'icon-mini-add'">可折叠面板2</div>
					<div data-options="title:'管理员功能',iconCls:'icon-mini-add'">可折叠面板3</div>
				</div>
			</div>
			<div data-options="region:'south',title:'南部'" style="height:100px;">南部</div>
			<div data-options="region:'north',title:'北部'" style="height:100px;">北部</div>
			<div data-options="region:'center',title:'中部'">
				<!-- 选项卡tab 面板 -->
				<div class="easyui-tabs" data-options="fit:true">
					<!-- 这里的每一个div就是一个选项卡 -->
					<div data-options="title:'tab1'">tab标签面板1</div>
					<!-- closable 可关闭 -->
					<div data-options="title:'tab2',closable:true">tab标签面板2</div>
					<div data-options="title:'tab3',closable:true">tab标签面板3</div>
					<div data-options="title:'tab4',closable:true">tab标签面板4</div>
				</div>
			</div>
		</div>
	</body>
</html>

转载请注明：https://www.cnblogs.com/1906859953Lucas/p/9212852.html

微信关注我们

原文链接：https://yq.aliyun.com/articles/643677

转载内容版权归作者及来源网站所有！

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

python django打造自己的喜马拉雅 3（主页前端+数据库）

链接： 1背景和功能 2分析喜马拉雅接口 Django Model设计：先设计两张表，一张用来存储专辑（专辑名，封面图，专辑id，添加时间），另外一张存储专辑下每一集的信息（所属的专辑，序号，trackid，音频地址，添加时间）为了防止正在爬的时候，有人再次提交。加一个status表。前端布局：首页的布局什么的就简单写了，只需要一个输入框，能输入新的专辑id，再来个列表，展示已经爬过的专辑。输入框的样式是不是很熟悉呀?没错，直接抄的喜马拉雅主页的，连css名字都不想改。输入了albumId之后，post到服务器，开始抓取index---trackid：首页路由url配置： View中处理：把之前的两个接口封装到class ScrapManager中，没啥特别的地方，只是看起来要简洁些：接下来完善播放页面具体功能。

2018-06-22

572

参考URL： https://www.cnblogs.com/yyds/p/7065637.html 解决办法： 1）如果当前使用的是Python 2.7，可以安装Visual Studio 2008，也可以安装 Microsoft Visual C++ Compiler for Python 2.7来解决这个问题； 2）如果当前当前使用的Python 3.x，只能通过安装相应版本的Visual Studio或Visual C++来解决这个问题。如果不能重启，或是还是不能解决问题，则需要自已修改注册表了。参考URL： https://blog.csdn.net/donger_soft/article/details/44838109 1、打开注册表编辑器run regedit2、配置2.1、如果你安装的Python是32位的，则，创建如下项：HKEY_CURRENT_USER\Software\Microsoft\VisualStudio\9.0\Setup\VC2.2、如果你安装的Python是64位的，则，创建如下项：HKEY_CURRENT_USER\Software\Wow...

2018-06-22

601

资源下载

更多资源

优质分享App

近一个月的开发和优化，本站点的第一个app全新上线。该app采用极致压缩，本体才4.36MB。系统里面做了大量数据访问、缓存优化。方便用户在手机上查看文章。后续会推出HarmonyOS的适配版本。

Mario

马里奥是站在游戏界顶峰的超人气多面角色。马里奥靠吃蘑菇成长，特征是大鼻子、头戴帽子、身穿背带裤，还留着胡子。与他的双胞胎兄弟路易基一起，长年担任任天堂的招牌角色。

腾讯云软件源

为解决软件依赖安装时官方源访问速度慢的问题，腾讯云为一些软件搭建了缓存服务。您可以通过使用腾讯云软件源站来提升依赖包的安装速度。为了方便用户自由搭建服务架构，目前腾讯云软件源站支持公网访问和内网访问。

Spring

Spring框架（Spring Framework）是由Rod Johnson于2002年提出的开源Java企业级应用框架，旨在通过使用JavaBean替代传统EJB实现方式降低企业级编程开发的复杂性。该框架基于简单性、可测试性和松耦合性设计理念，提供核心容器、应用上下文、数据访问集成等模块，支持整合Hibernate、Struts等第三方框架，其适用范围不仅限于服务器端开发，绝大多数Java应用均可从中受益。