Layui表单字段自定义验证

最新推荐文章于 2021-09-09 15:03:24 发布

原创最新推荐文章于 2021-09-09 15:03:24 发布 · 1.9k 阅读

0 ·

CC 4.0 BY-SA版权

前端js 专栏收录该内容

14 篇文章

订阅专栏

本文详细介绍了使用layui框架进行表单验证的方法，包括Form组件的name属性设置、lay-filter属性与Form名称的对应关系，以及如何通过layui.js自定义表单验证规则。通过实例展示了如何验证公司简称是否为空或与公司全称重复。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

注意事项：

1. Form 要有name

<form class="layui-form column-content-detail" name="formDemo" action="" method="post">

</form>

2. 提交时要有 lay-filter 且等于 from的name

<button class="layui-btn layui-btn-success" lay-submit lay-filter="formDemo">立即提交</button>

3. 加载layui.js ,并在中定义验证

 <script type="text/javascript">
	   layui.use(['form'], function() {
		   var $ = layui.jquery;
		    var form = layui.form(),layer = layui.layer;		   
		   form.verify({
			   comany_cn: function(value, item){ //value：表单的值、item：表单的DOM对象
				   var company_name = $('#input-company_name').val();
				   if(value==""){			   
					   return '公司简称不能为空！';
				   }else if(value==company_name){			   
					  return  '公司简称不能是公司全称！';
				   }			   
			   }		   
			 });     
		 });
</script>