easyUI 插件
注意:
如果一个页面引入了一个有easyUI插件的页面,那么本页面也一定要引入相应的easyUI插件的js,
要熟练使用API文档
1).简介(实现方式)
封装大量的jQuery插件(简化ajax,jquery,css样式,布局)
(1)插件实现:
① HTML标签+插件的class样式
<a href="#" class="easyui-linkbutton">我是讲文明</a>
② HTML标签+基于编程的插件实现
<a href='#' id="btn">我是洪世鹏</a>
js代码: $("#btn").linkbutton();
(2)插件内容:
属性:设置插件的样式,图标,宽度,高度
事件:单击事件,双击
方法:修改插件属性,状态
2).搭建easyUI环境、实现第一个esayUI插件
(1)搭建EasyUI的环境
搭建环境的步骤:
① 导入需要的css样式文件:easyui.css、icon.css
② 导入相关的js文件
jquery.min.js
jquery.easyui.min.js
jquery.easyui-lang-zh_CN.js
③ 注意:themes中的文件相对路径不能变
(2)第一个插件
插件:按钮(linkbutton)
实现插件效果标准开发步骤[记住]
标签: <a href="#">按钮</a>
样式名(规范): easyui-样式名
实例:
① 方式一:<a href="#" class="easyui-linkbutton">按钮</a>
② 方式二:js插件名(调用插件方法)
$("选中超链接").插件名();
$("a").linkbutton();