form异步无刷新提交,提交后可以显示弹出框,否则弹出框会被刷新不见,使用 preventDefault

出错点:确认按钮上.加onclick事件.每次点击都会追加给form追加on监听方法.累加on方法,重复提交

suppress_exception:true 阻止异常 (百度推送 jdk) 向下按

preventDefault ( jquery 阻止 form默认提交)

01传递参数,显示或者隐藏弹出框

/*start 显示和隐藏遮罩*/
function controlShade(date){
if(date == 's'){
$(".mask").show();  //添加遮罩,height:100% width:100% background:#ccc  opacity:0.7 z-index:999 弹出框z-index:9999
$(".maskbox").stop().animate({"margin-top":10+"px"},300);
}else if(date == 'h'){
$(".maskbox").stop().animate({"margin-top":-500+"px"},300,function(){
$(".mask").hide();
});
}
}

margin-top:-500推到页面以外

/*end 显示和隐藏遮罩*/

02 获取到form表单,追加on方法,传递submit参数,和方法,当form表单执行submit时.执行第二个参数的方法

<form id="addMester" action="">
<ul>
<li>
<span>姓名：</span>
<input type="text" name="contact_name" id="contact_name" class="inputStyle2 memberName" maxlength="10" required="required">
</li>
<li>
<span>手机号：</span>
<input type="tel" name="contact_mobile" id="contact_mobile" class="inputStyle2" required="required" pattern="(^1[3|4|5|7|8][0-9]{9}$)" title="请输入正确的手机号码！">
</li>
<li>
<span>证件类型：</span>
<select name="idType" id="idType">
<option value="身份证">身份证</option>
<option value="护照">护照</option>
<option value="军官证">军官证</option>
</select>
</li>
<li>
<span>证件号：</span>
<!--<input type="text" id="credentials" class="inputStyle2" required="required" pattern="" title="请根据证件类型输入正确的证件号">
</li>
</ul>

<div class="chooseBtns">
<input type="submit" class="sureAdd" onclick="" value="确定">
<input type="button" class="cancelAdd" onclick="controlShade('h')" value="取消">
</div>
</form>

03  prevent 阻止    present 现在 礼物

function initAddContectForm(){
var $forms=$("#addMester");

$forms.on('submit', function(ev){  //获取到form表单后,提交on监听方法.监听submit,调用方法,传递参数.去阻止默认
ev.preventDefault();  //一定要阻止默认的提交方法,

var name=$("#contact_name").val();
var mobile=$("#contact_mobile").val();
var idcardtype=$("#idType").find("option:selected").val();
var idcard=$("#credentials").val();

$.ajax({
url:"/Apply/addcontacts",
type:'POST',
data:{'contact_name':name,'contact_mobile':mobile,'contact_identication_type':idcardtype,'contact_identication_number':idcard},
dataType:'json',
success:function(d){
var html="<label style='padding:0 5px''><input type='checkbox' name='apply_members[]' value='"+d["contact_id"]+"'>"+d['contact_name']+"</label>";
$(".addMmber").append(html);
iChecks();return;
},error:function(){
alert('error');
}

});

controlShade('h');
});
}

04 页面加载完毕.启动方法,给form表单添加一个on方法,

<script>
initAddContectForm();
</script>

错误