EasyUI前端框架
1.常用的前端框架EasyUI框架,Jquery框架,Vue框架2.EasyUI的介绍介绍EasyUI是一个前端开发的框架,其将常用的页面开发使用的组件进行了封装,前端开发人员只需将EasyUI的资源导入项目后使用即可,快速提升开发效率。使用① 导入EasyUI的资源② 查阅API文档使用EasyUI的组件完成页面开发学习:① EasyUI提供的组件及其使用方式(API)② EasyUI的布局3.
1.常用的前端框架
EasyUI框架,Jquery框架,Vue框架
2.EasyUI的介绍
介绍
EasyUI是一个前端开发的框架,其将常用的页面开发使用的组件进行了封装,前端开发人员只需将EasyUI的资源导入项目后使用即可,快速提升开发效率。
使用
① 导入EasyUI的资源
② 查阅API文档使用EasyUI的组件完成页面开发
学习:
① EasyUI提供的组件及其使用方式(API)
② EasyUI的布局
3.EasyUI的常用组件
资源的介绍:
① 将从官网上下载的EasyUI的资源压缩包解压
② demo文件夹:EasyUI官方提供的每个组件的使用示例效果代码。
③ locale文件夹:组件中显示的数据语言的js文件
④ plugins文件夹:是EasyUI提供的组件对应的js文件
⑤ src文件夹:源码文件夹
⑥ themes文件夹:EasyUI官方提供的整套的样式
⑦ jquery.min.js文件:依赖的jquery文件,建议使用官方提供的jquery文件不要自 己随便更换版本,可能会造成版本不兼容。
⑧ jquery.easyui.min.js:封装了所有组件的js文件
EasyUI的常用组件
① 基础组件:常用的比较小的功能组件,不是每个网页中都会用到
② 布局组件: 很重要,每个网页都会使用,完成网页的布局的。
③ 菜单与按钮组件:很重要,每个网页都会使用,在网页中完成菜单和按钮的效果
④ 表单组件:很重要,搜集用户数据,封装了常用的数据校验,并支持自定义校验
⑤ 窗口组件:在当前页面中显示子窗口效果,对页面中的功能进行完善。
⑥ 数据网格和树组件:很重要,非常之重要。在网页中显示表格以及树状数据
4.组件的使用
1. easyui-panel 面板
作用
在网页中显示一个面板效果,可以在面板中显示网页中的数据
使用
① 在jsp页面中引入EasyUI的资源
② 在页面创建一个div标签,并设置其class属性,属性值为‘easyui-panel’
③ 在div标签上使用属性data-options设置面板的初始化效果,设置组件的属性和
事件,以键值对的形式设置,不同的键值对使用逗号隔开。
④ 可以使用jquery来调用组件提供的方法,根据用户在网页中的行为动作对组件
作出对应的操作。
效果图:
2. easyui的组件使用流程
① 在jsp中引入EasyUI的资源
② 在jsp页面使用HTML方式或者js方式创建组件
③ 使用组件的属性和事件来初始化设置组件的效果
④ 使用组件的方法实现组件和用户交互的效果
- easyui-textbox组件
① 声明一个普通的input文本标签
② 通过js代码的方式完成textbox组件初始化效果
元素标签.组件名({属性:值,属性:值,…,事件名:函数…})
4. easyui-passwordbox组件
作用
在页面中显示一个密码框
使用
HTML标签方式或者js方式,参照API文档
效果示例
5. easyui-combobox下拉框组件
作用
在页面中显示一个下拉框效果,提供了丰富的属性和事件可以让我们根据需求来设 置自己想要的组件效果。
使用
使用HTML标签方式或者js方式完成创建和初始化设置,参照API
效果:
6. easyui-datebox 日期框
作用
在页面中显示一个可以选择日期的文本框
使用
使用HTML标签创建和初始化或者使用js方式创建和初始化
效果图:
具体信息看API
更多推荐
所有评论(0)