出錯點:確認按鈕上.加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>
錯誤