您的位置:首页 > 产品设计 > UI/UE

easyui的强大功能

2016-09-10 10:05 253 查看
     不管你是前端java开发人员还是后端开发人员,如果你到现在为止还没有听说过easyui,我觉得你算不上一个合格的开发人员,因为easyui真的太强大了,里面定义了好多他自带的功能,话不多说,看看下面最简单的代码,让你初步了解easyui的强大

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>validatebox.html</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<link rel="stylesheet" href="../themes/default/easyui.css" type="text/css"></link>
<link rel="stylesheet" href="../themes/icon.css" type="text/css"></link>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>

</head>

<body>
<div style="margin: 200px;">
</div>
姓名:<input id="nameID"/><p/>
<script type="text/javascript">
$("#nameID").validatebox({
required:true,
validType:['length[1,6]','zhongwen']
});
</script>

<script type="text/javascript">
//自定义规则:zhongwen
$.extend($.fn.validatebox.defaults.rules,{
//zhongwen规则名
zhongwen:{
validator:function(value){
if(/^[\u3220-\uFA29]*$/.test(value)){
return true;
}
},
//如果不符合中文规则,以下就是提示信息
message:'姓名必须为中文'
}
});
</script>

邮箱:<input id="emailID"/><p/>
<script type="text/javascript">
$("#emailID").validatebox({
required:true,
validType:['length[1,30]','email']
});

</script>

密码:<input id="passwordID"/><p/>
<script type="text/javascript">
$("#passwordID").validatebox({
required:true,
validType:['length[6,6]','english']
});
</script>
<script type="text/javascript">
$.extend($.fn.validatebox.defaults.rules,{
english:{
validator:function(value){
if(/^[a-zA-Z]/.test(value)){
return true;
}
},
message:'密码必须为英文'
}

});

</script>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: