1, Messager弹窗信息
方法:
$.messager.alert(...), 在网页中间弹出一个窗口
$.messager.confirm(...) 弹出一个确认窗口, 有确定和取消两个按钮, 确定返回true, 取消返回false
$.messager.progress(...) 显示一个进度条
$.messager.prompt(...) 显示一个带文本输入框的对话弹窗
$.messager.show(...)在网页的右下角弹出一个窗口提示信息
2, Panel面板
构建的方式有两种, 可以通过使用JS构建panel的方法, 也可以让其调用easyui类包内容, 但是这两种方法的前提是都必须先有一个已经写好的<div></div>
常用属性:
id: 面板的id属性
title: 面板的标题
iconCls: 在面板的右上角添加一个小图标
设置面板的宽度
height: 设置面板的高度
3, window窗口
构建的方式有两种, 可以通过使用JS构建panel的方法, 也可以让其调用easyui类包内容, 但是这两种方法的前提是都必须先有一个已经写好的<div></div>
打开和关闭窗口。
$('#win').window('open');
$('#win').window('close');
通过ajax读取窗口内容。
$('#win').window('refresh', 'get_content.php'); (在eclipse上试了一下只能加在jsp页面的文件, 类似于那个iframe框架, Servlet加载不出来), 加载Servlet的时候可以用JS的方法创建, 然后用 href 属性可以加载Servlet
常用属性
collapsible: 参数为bealoon类型, 定义是否显示折叠菜单title: 窗口的文本标题, 参数是一个String类型的
minimizable: 参数为bealoon类型, 定义是否显示最小化按钮
maximizable: 参数为bealoon类型, 定义是否显示最大化按钮
closable: 参数为bealoon类型, 定义是否显示关闭按钮
4, linkbutton按钮
创建一个按钮也是有两种方法, 通过标签和JS, 按钮就只有一个onclick事件.
常用属性:
id: linkbutton的id属性
text: 按钮上需要显示的文本
事件:
onclick: 在点击按钮时所触发的事件
5, dialog对话窗口
该对话框是一种特殊类型的窗口，它在顶部有一个工具栏，在底部有一个按钮栏。创建对话窗口也是可以通过标签和JS两种方式来创建
常用属性:
继承window的属性, 重点记住下面两个
toolbar: 定义对话框的工具栏, 在上端显示, 语法格式:
toolbar:[{
...:...,
...:...
}]
buttons: 定义对话框的按钮栏, 在底端显示, 语法格式:
buttons:[{
...:...,
...:...
}]
还有一个比较重要的特点: 也同样用于上面的其他window, panel, linkbutton等, 在标签属性中有一个data-options="...", 这个没法在JS中使用, 定义的话只能在标签里面写上
6, 验证框(validatebox)和文本框(textbox)
这两者的相同点都是可以通过上面说到的两种方式创建, 用标签或者是JS
不同点:
1, textbox可以在输入框内加icon图标, 而validatebox不支持
2, validatebox可以进行自定义的验证, 而textbox没有自定义, 只能使用自己有的那些方法进行验证.
validatebox自定义验证格式如下
$.extend($.fn.validatebox.defaults.rules, { minLength: { validator: function(value, param){ return value.length >= param[0]; }, message: 'Please enter at least {0} characters.' } }); ... ... ... <input class="easyui-validatebox" data-options="validType:'minLength[5]'">
这样就可以验证长度是否为5
不过这段代码看不懂, 希望能有朋友简单的解释一下
7, 下拉列表菜单combobox
自定义下拉框显示一个可编辑的文本框和下拉面板在html页面。