本文出處：http://blog.csdn.net/chaijunkun/article/details/8229655，轉載請註明。由於本人不定期會整理相關博文，會對相應內容作出完善。因此強烈建議在原始出處查看此文。
身爲一名一直做後端開發的小猿，不務正業去搞前端的東東實在是形勢所逼。後端的東西套路越來越清晰，對於典型應用開發，親愛的開源大神們早就提供了一系列可以使用的工具。公司人手不足，索性前端後端一攬子都包了。HTML、CSS、JS、PS、Java統統自己來搞。這年頭不就拼個“綜合實力”嘛。這不，前不久就遇到了一個關於IE的JS問題。閒言少敘，下面我先描述一下背景：
頁面中包含一個表單，並且使用了jQuery和jQuery的表單驗證插件Validation Engine。爲了有更好的交互性，想做成異步提交，減少頁面刷新。但是因爲表單中還含有input type="file"的文件元素。 所以不能使用jQuery的ajax來做提交。只能用form target="oneiframe"來做一個模擬的。
<script type="text/javascript">
$(document).ready(function() {
$("#user").validationEngine();
$("#user").validationEngine('attach',{
onValidationComplete:function(form, formIsValid){
if(!$("#agree").is(":checked")){
alert("請閱讀隱私協議並同意我們的條款方可繼續");
return;
}
if (formIsValid){
$("#user").get(0).submit();
return;
}
}
});
});
</script>
<iframe name="hiddenFrame" style="display:none;"></iframe>
<form action="updateInfo.do" method="post" enctype="multipart/form-data" id="user" target="hiddenFrame">
暱稱：<input type="text" name="nick" class="validate[required, maxSize[30]]" value="" />
頭像：<input type="file" name="headPic" class="" />
<input type="checkbox" id="agree" />我同意隱私協議
<input type="submit" value="提交" />
</form>上面的代碼是我做的一個示例。<script>區域的代碼放在<head>內，<body>中有<iframe>和<form>。當點擊“提交”按鈕時會觸發Validation Engine的屬性檢查功能。從而檢查“暱稱”字段是否填寫，長度是否大於30個字符。爲了展示我之前發現的問題，在“我同意隱私協議”複選框中沒有使用風格相同的class="validate[required]"來自動驗證，而是使用了在表單檢查完畢後利用補充代碼來驗證。
根據Validation Engine的示例（http://code.ciaoca.com/jquery/validation_engine/demo/demos/demoValidationComplete.html）得知，加入了
onValidationComplete:function(form, formIsValid)以上代碼中，如果複選框在點擊“提交”之前被選中，檢查將順利通過，會執行代碼：
if (formIsValid){
$("#user").get(0).submit();
return;
}研究了一晚上，最後找到了解決辦法。
將表單中的<input type="submit">改成<input type="button">即把按鈕類型從“提交”改爲“普通按鈕”，並加入onclick事件：
<input type="button" value="提交" οnclick="doSubmit()" />加入doSubmit()方法：
<script type="text/javascript">
function doSubmit(){
if ($("#user").validationEngine("validate")){
$("#user").get(0).submit();
}
};
</script>然後將原來腳本中的判定提交代碼刪除：
$("#user").get(0).submit();
return;
}
此時再點擊提交就不會出現提交兩次的問題了。
