场景

效果

属性

名称	类型	描述	默认值
required	boolean	定义是否字段应被输入。	false
validType	string,array	定义字段的验证类型，比如 email、url，等等。可能的值： 1、验证类型字符串，应用单个验证规则。 2、验证类型数组，应用多个验证规则。单个字段上的多个验证规则自版本 1.3.2 起可用。代码实例： <input class="easyui-validatebox" data-options="required:true,validType:'url'"> <input class="easyui-validatebox" data-options=" required:true, validType:['email','length[0,20]'] ">	null
delay	number	延迟验证最后的输入值。该属性自版本 1.3.2 起可用。	200
missingMessage	string	当文本框为空时出现的提示文本。	该字段是必需的。
invalidMessage	string	当文本框的内容无效时出现的提示文本。	null
tipPosition	string	定义当文本框的内容无效时提示消息的位置。可能的值：'left'、'right'。该属性自版本 1.3.2 起可用。	right
deltaX	number	在 X 方向的提示偏移。该属性自版本 1.3.3 起可用。	0
novalidate	boolean	当设置为 true 时，则禁用验证。该属性自版本 1.3.4 起可用。	false

方法

名称	参数	描述
destroy	none	移除并销毁该组件。
validate	none	进行验证以判定文本框的内容是否有效。
isValid	none	调用 validate 方法并且返回验证结果，true 或者 false。
enableValidation	none	启用验证。该方法自版本 1.3.4 起可用。
disableValidation	none	禁用验证。该方法自版本 1.3.4 起可用。

实现

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" type="text/css" href="/easyui/themes/icon.css"><link rel="stylesheet" type="text/css" href="/easyui/themes/default/easyui.css"><script type="text/javascript" src="/easyui/jquery.min.js"></script><script type="text/javascript" src="/easyui/jquery.easyui.min.js"></script>
</head>
<body>
<input id="vv" class="easyui-validatebox" data-options="required:true,validType:'email'"><br>
<input id="vv1"><br>
<input id="pwd" name="pwd" type="password" class="easyui-validatebox" data-options="required:true"><br>
<input id="rpwd" name="rpwd" type="password" class="easyui-validatebox"required="required" validType="equals['#pwd']"><br><script type="text/javascript">$('#vv1').validatebox({required: true,validType: 'email'});$.extend($.fn.validatebox.defaults.rules, {equals: {validator: function(value,param){return value == $(param[0]).val();},message: '密码不一致'}});
</script>
</body>
</html>

EasyUI中Validatebox验证框的简单使用相关推荐

EasyUI中Combox组合框的简单使用
场景效果用法从带有预定义结构的 <select> 元素创建组合框(combobox). <select id="cc" class="easyui ...
EasyUI中Datebox日期框的简单使用
场景效果属性该属性扩展自组合(combo),下面是为日期框(datebox)添加的属性. 名称类型描述默认值 panelWidth number 下拉日历面板的宽度. 180 panelH ...
EasyUI中ToolTip提示框的简单使用
场景效果属性名称类型描述默认值 position string 提示框(tooltip)位置.可能的值:'left'.'right'.'top'.'bottom'. bottom cont ...
EasyUI中Messager消息框的简单使用
场景效果属性名称类型描述默认值 ok string 确定按钮的文本. Ok cancel string 取消按钮的文本. Cancel 方法名称参数描述 $.messager.sho ...
jQuery EasyUI API 中文文档 - ValidateBox验证框
jQuery EasyUI API 中文文档 - ValidateBox验证框,使用jQuery EasyUI的朋友可以参考下. 用 $.fn.validatebox.defaults 重写了 def ...
Android中MaterialSearchView(搜索框)的简单实用
Android中MaterialSearchView(搜索框)的简单实用收搜框架有好多,动画效果满炫酷的就是代码太多,没发抽取他的搜索功能,而这个却比较好用些,直接从代码里面抠出来一个简单实现搜索功 ...
easyui中combobox 验证输入的值必须为选项框中的数据
当作为提示框的方式时,combobox必须设置为允许用户输入的模式,但是当用户输入后未选择正确的数据就直接按tab或点击鼠标离开控件会导致用户输入无效的值并且通过验证,为了避免这种情况的发生我们需要对 ...
EasyUI中Datagride数据网格的简单使用
场景效果数据网格(DataGrid)属性该属性扩展自面板(panel),下面是为数据网格(datagrid)添加的属性. 名称类型描述默认值 columns array 数据网格(data ...
EasyUI中Tabs标签页的简单使用
场景效果属性 tabs none 返回全部的标签页面板(tab panel). resize none 调整标签页(tabs)容器的尺寸并做布局. add options 添加一个新的标签页面板( ...

EasyUI中Validatebox验证框的简单使用

场景

效果

属性

方法

实现

EasyUI中Validatebox验证框的简单使用相关推荐

最新文章

热门文章