这篇文章给大家分享的是layui的表单验证，相信大部分人都还没学会这个技能，为了让大家学会，给大家总结了以下内容，话不多说，一起往下看吧。
1、排序 验证
html代码
计算
安全
数据库
网络和加速
企业服务
<div class="layui-form-item">
<label class="layui-form-label">排序</label>
<div class="layui-input-block">
<input type="number" name="sort" autocomplete="off" min="0" max="99999" lay-verify="sort" class="layui-input">
</div>
</div>type="number" 之后文本框的后面就出现如上图那样的效果，并且只能输入数字和小数点
js代码
layui.use([ "form", "layer" ], function() {
var form = layui.form;
var layer = layui.layer;
//表单验证
form.render();//这句一定要加，占坑
form.verify({
sort:[/^$|^[0-9]{0,5}$/, '只能是数字且范围0~99999！']//这个就是上面的排序lay-verify="sort"
,remark: function (value){
if(value.length > 200){
return '长度大于200！请重新输入';
}
}
});
});2.金额 验证
效果和排序一样
<div class="layui-form-item">
<label class="layui-form-label">余额(元)</label>
<div class="layui-input-block">
<input type="number" name="balance" id="balance" lay-verify="money"
autocomplete="off" placeholder="单位：元"
class="layui-input" >
</div>
</div>layui.use([ "form", "layer", "laydate" ], function() {
laydate = layui.laydate;
form = layui.form;
layer = layui.layer;// 表单验证
form.render();
form.verify({
lenth60 : function(value) {
if (value.length > 50) {
return '长度大于50！请重新输入';
}
},
lenth500 : function(value) {
if (value.length > 400) {
return '长度大于400！请重新输入';
}
},
money : function(value) {
if (value.length > 0) {
var reg = /(^[0-9]([0-9]+)?(\.[0-9]+)$)|(^(0){1}$)|(^([0-9]+)?$)/;
if (!reg.test(value)) {
return '输入格式有误';
}
}
if (value.length > 50) {
return '长度大于50！请重新输入';
}
}
});
//下面这段代码主要是用于强制清除当用户输入0开头的数字，比如0000,02323，匹配到的话就为0
//如果要在layui里面 写js事件之类的代码就一定要放在use组件模块里面，这是其中一个坑！
$('#balance').bind('input propertychange', function() {
var balance = $("#balance").val();
var zero = /^(0){2,}$|^(0)([0-9])?$/;
if (zero.test(balance)) {
$('#balance').val(0);
}
});
});看完上述内容，你们对layui的表单验证有进一步的了解吗？如果还想了解更多相关内容，欢迎关注亿速云行业资讯频道，感谢各位的阅读。
亿速云「云服务器」，即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘，价格低至29元/月。点击查看>>
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
