jquery-easyui中文详细说明文档(3)

2018-09-25 12:06

5.1. 示例图片

5.2. 示例代码

(很多属性可以和Window的用法依洋,在标记语言中定义,比如说:icon, title等等)

1.

style=2. Dialog Content. 3.

然后按照《jQuery EasyUI框架使用文档》包含必要文件后,只要在$(function(){ }); 里插入下面的代码即可:

1. $(\'#dd\').dialog(options);

Window需要依存于以下的三个组件: * 可拖放(Draggable) * 调整大小(Resizable) * 面板(panel) * 窗口(window)

* 链接按钮(linkbutton)

下面来介绍Window的具体用法,首先来看属性大多数的属性和窗口(Window)的属性是相同的,下面列出一些 Dialog私有的属性:

属性名 title 类型 字符对话框的标题文本 串 描述 默认值 New Dialog false false false false collapsible 布尔 定义是否显示可折叠按钮 minimizable 布尔 定义是否显示最小化按钮 maximizable 布尔 定义是否显示最大化按钮 resizable toolbar buttons 布尔 定义对话框是否可编辑大小 数组 数组 对话框上的工具条,每个工具条包括: text, iconCls, null disabled, handler etc. 对话框底部的按钮,每个按钮包括: text, iconCls, null handler etc. 事件

Dialog的事件和窗口(Window)的事件相同,可以参考《jQuery EasyUI 窗口(Window)用法》 方法

除了”header”和”body”以外,Dialog的函数方法和窗口(Window)的相同,同样也可以参考《jQuery EasyUI 窗口(Window)用法》

6. jQuery EasyUI 窗口(Window)用法

jQuery EasyUI 窗口(Window)的主要用法和面板(panel)用法差不多,首先来看一下jQuery EasyUI 窗口(Window)在页面里显示的效果是这样的:

6.1. 样图

6.2. 示例代码

(很多Window的属性可以在标记语言中定义,比如说:icon, title等等)

1.

然后按照《jQuery EasyUI框架使用文档》包含必要文件后,只要在$(function(){ }); 里插入下面的代码即可: 生成一个Window:

1. $(\'#win\').window(options);

打开一个Window:

1. $(\'#win\').window(\'open\');

Window需要依存于以下的三个组件: * 可拖放(Draggable) * 调整大小(Resizable) * 面板(panel)

下面来介绍Window的具体用法,首先来看属性大多数的属性和面板(panel)的属性是相同的,下面列出一些Window私有的属性:

属性名 类型 zIndex 描述 默认值 9000 true true true true 数字 窗口的 z-index 属性,可以通过这个属性来增加 draggable 布尔 定义窗口是否可被拖动 resizable 布尔 定义窗口是否可以被改变大小 shadow modal 布尔 如果设置为true,窗口的阴影也将显示。 布尔 定义窗口是否是一个模式窗口。 Window也重写了Panel里的一些属性

属性名 title collapsible minimizable maximizable 类型 描述 默认值 New Window true true true 字符串 窗口的标题文本 布尔 布尔 布尔 定义是否显示可折叠定义按钮 定义是否显示最小化按钮 定义是否显示最大化按钮 closable 布尔 定义是否显示关闭按钮 true 事件

Window的事件和面板(panel)的事件相同,可以参考《jQuery EasyUI 面板(Panel)用法》 方法

除了”header”和”body”以外,Window的函数方法和面板(panel)的相同,同样也可以参考《jQuery EasyUI 面板(Panel)用法》

7. jQuery EasyUI 验证框(ValidateBox)用法

jQuery EasyUI 验证框(ValidateBox)在表单的验证方面给我们提供了很方便的方法,下面来介绍一下验证框(ValidateBox)的详细用法:

7.1. 样图

7.2. 示例代码

1.

然后按照《jQuery EasyUI框架使用文档》包含必要文件后,只要在$(function(){ }); 里插入下面的代码即可:

1. $(\'#vv\').validatebox(options)

下面介绍一下验证规则:

验证规则是通过使用属性 “required”和”validType”来定义的,已经实施的规则如下:

? ? ?

email: 匹配电子邮件正则表达式规则 url: 匹配URL正则表达式规则

length[0,100]: 允许字符串长度的范围

当然也可以自定义验证规则,重写$.fn.validatebox.defaults.rules 可以定义一个校验器的功能和无效的显示消息。例如,要定义一个minLength有效的类型:

1. $.extend($.fn.validatebox.defaults.rules, {

2. minLength: {

3. validator: function(value, param){ 4. return value.length >= param[0]; 5. },

6. message: \'Please enter at least {0} characters.\' 7. } 8. });

定义好以后我们就可以使用了,下面的代码表示输入的最小长度是5个字符:

1.

下面来介绍更多的用法:属性

属性名 required validType 类型 描述 false 默认值 布尔 定义文本域是否为必填项 字符定义字段的验证类型,比如email, url, null etc. 串 This field required. is 字符missingMessage 当文本框为空时提示的文本信息 串 invalidMessage 字符当文本框内容不合法时提示的文本信null 串 息 方法

方法名 参数 destroy validate isValid none 删除并且销毁组件 none 做验证以确定文本框的内容是否是有效的。 none 调用验证方法并返回验证结果,true或者false 描述 8. jQuery EasyUI 数字框(NumberBox)用法

jQuery EasyUI 数字框(NumberBox)相对来说比较简单,就是控制一个输入只接

受数字类型,其他所有的字符都不接受。这在我们的应用中还是能起到很大作用

的,比如说电话号码框获取金额框是只接受数字的。下面来介绍数字框(NumberBox)用法的详细用法:

8.1. 样图

8.2. 示例代码

1.

然后按照《jQuery EasyUI框架使用文档》包含必要文件后,只要在$(function(){ }); 里插入下面的代码即可:

1. $(\'#nn\').numberbox(options);

这里的options是选项,可以参考下表:

选项名 min max precision 类型 数字 数字 数字 描述 文本框中可允许的最小值 文本框中可允许的最大值 最高可精确到小数点后几位 默认值 null null 0 9. DataGrid

jquery-easyui中文详细说明文档(3).doc 将本文的Word文档下载到电脑 下载失败或者文档不完整,请联系客服人员解决!

下一篇:2017-2023年中国通信工程施工行业市场运营态势与发展趋势研究报

相关阅读
本类排行
× 注册会员免费下载(下载后可以自由复制和排版)

马上注册会员

注:下载文档有可能“只有目录或者内容不全”等情况,请下载之前注意辨别,如果您已付费且无法下载或内容有问题,请联系我们协助你处理。
微信: QQ: