layui使用经验总结（四）——“提交”相关内容总结

layui点击、提交事件三种方式

普通点击

<button type="button" class="layui-btn layui-btn-sm layui-btn-success" id="draft">reset</button>
$("#reset").on("click",function(){
		var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  		parent.layer.close(index); 
  		history.back();
	});

name包含某字符串控件点击

$("body").on('click',"input[name$='spareCategoryName']",function(){
            var categoryIds = toChooseCategory(this);
        });

方法点击

<button type="button" class="layui-btn layui-btn-sm layui-btn-normal" onclick="cancelWindow()">取消</button>
function cancelWindow()

表单提交

form.on('submit(one)', function(data) {
		layer.load();
		var post=$.post("${base}/add.json", data.field, function(res) {
	}
}

ajax提交

form.on('submit(submit)', function(data) {
			var telephone =$("#telephone").val();
			$.ajax({
				type:"post",
				url: '${base}/login/modify.json',
				data: {"telephone":telephone},
				success: function(data){
					layer.confirm('修改成功！', {
						  btn: ['确定'] //可以无限个按钮  
						}, function(index){
							window.location.href=base + "/login/welcome.html";
						});
		           
				}
			});		
			return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可	

		});

绕过表单验证提交

//鼠标离开时保存项目数据
	$("#projectForm").on('blur', "input", function() {
		 $.post("${base}/${extParams.controllerUrl}/add.json?currentSteps=1", $("#projectForm").serialize(), function(res) {
		})
	})

注意：需要序列化 Form表单中input标签的值，那么就需要给input标签添加相应的name属性
检查你需要序列化的标签的属性是disabled，如果是的话，把disabled属性用readonly替换即可
form表单如果有两个id表单序列化无效，为空

$("#projectForm").serialize()表单序列化

添加和编辑是一个页面（添加是在页面上，修改是弹框页面）

layui判断是否是子页面，调用跳转方法
// 判断是否为子页面
var index = parent.layer.getFrameIndex(window.name);
if (index) {
parent.window.location.href = ‘KaTeX parse error: Expected 'EOF', got '}' at position 44: …ist.html'; }̲ else { wi…{base}/projectApply/toApplyList.html’;
}
关闭当前弹出层
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index);

layui弹框

（不能像js原生的alert一样中止执行，还是会执行下面的语句，加window.location.href提示一出立马跳转）

简单提示

layer.alert('欢迎！');

时效提示

layer.msg("", {               		 
            		 time: 1000, //2s后自动关闭
            		 shade:0.6
        			}, function(){
           				window.location.href=base + "/login/welcome.html";
           			});
				 }

按钮监控提示

layer.confirm('修改成功！', {
						  btn: ['确定'] //可以无限个按钮
						  
						}, function(index){
							window.location.href=base + "/login/welcome.html";
						});

按钮监控提示及关闭按钮监控

layer.open({
			  content: '密码已被重置为默认密码，请立刻修改您的账户密码！'
			  ,btn: ['确认']
			  ,yes: function(index, layero){
				  window.location.href= "${base}/login/reset.html";	
			  }
			  ,cancel: function(){ 
				  window.location.href= "${base}/login/reset.html";	
			  }
			});

弹页面

layer.open({
				type : 2,
				title: data.TITLE,
				moveOut: true,
				shade:0,
				resize:true,
				maxmin:true,
				skin: 'layer-skin layer-skin-max',
				area: ['90%','90%'],
				content : [ '${base}/projec/toView.html, 'no' ]
			});

表单自定义验证规则

lay-verify=“required|code”

form.verify({  
			code: function(value){ 
					  var remindVal = null;
					  var str = $("#strField3").val();
					  console.log(str);
					  var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,18}$/;
					  if(!reg.test(str)) {
						  remindVal = "必须18位数字或字母由组成";
					  }

					  return remindVal;
			        }
		       
		  });