layui 实现增加修改模块

最新推荐文章于 2023-03-28 11:20:41 发布

herospirit

最新推荐文章于 2023-03-28 11:20:41 发布

阅读量2.2k

点赞数 1

文章标签： jquery

本文链接：https://blog.csdn.net/weixin_44615754/article/details/104976224

版权

本文介绍了如何使用 layui 框架来实现前端的增加和修改功能，详细讲解了从界面设计到后台交互的完整流程。

摘要由CSDN通过智能技术生成

增加模块

<script type="text/javascript">
	/* 加载layui组件 */
	layui.use([ 'element', 'form' ], function() {
   //重新渲染页面
		var element = layui.element;
		element.init();
		var form = layui.form
		form.render();
	});
	var check = false;
	/* 用户名验证 */
	function userTest() {
   
		var userName = $("#userName").val();
		if (userName == null || userName == "") {
   
			$("#usTip").html("*用户名不为空");
			check = false;
		} else {
   
			$("#usTip").html("");
			check = true;
		}
		return check;
	}
	/* 用户账号唯一验证 */
	function acTest() {
   
		var account = $("#account").val();
		if (account == null || account == "") {
   
			$("#accTip").html("*用户名不能为空");
			check = false;
		} else if (account.length<6 || account.length>18) {
   
			$("#accTip").html("*用户名长度必须在6-18位之间");
			check = false;
		} else if (account.length >= 6 && account.length <= 18) {
   
			$.post("${pageContext.request.contextPath}/User/testAccount", {
   
				"account" : account,
			}, function(data) {
   
				$("#accTip").html(data);
			})
			$("#accTip").html("");
			check = true;
		}
		return check;
	}
	/* 电话号码验证 */
	function phoneTest() {
   
		var phone = $("#phone").val();
		if (!(/^1[3456789]\d{
   9}$/.test(phone))) {
   
			$("#phTip").html("*手机号码格式不正确！")
			check = false;
		} else {
   
			$("#phTip").html("")
			check = true;
		}
		return check;
	}
	/* 邮箱验证 */
	function emailTest() {
   
		var email = $("#email").val();
		if (!(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/
				.test(email))) {
   
			$("#emTip").html("*邮箱格式不正确！");
			check = false<