最近在開發(fā)中遇到了表單提交前驗(yàn)證的問題,用一個(gè)普通的button按鈕代替submit按鈕,
在提交前觸發(fā)這個(gè)button的onclick事件,在其事件中觸發(fā)form的submit事件。問題出現(xiàn)了:
以下是出現(xiàn)相關(guān)代碼:
<form action=" <table align="center" width="420px" cellPadding="2" cellSpacing="1" bgcolor="#A4B6D7" style="word-wrap:Break-word;">
<tr style="cursor: hand;background:#d7e3f6" >
<td width="20%" align="right">條型碼</td>
<td><input style="width:90%" type="text" name="GOODSNUM" size="30" maxlength="8" ></td>
</tr>
<tr>
<td align="center" colspan="2">
<input type="button" name="save" value="保存" onclick="if((confirm('確定要提交嗎?'))) this.form.submit();"/>
</td>
</tr>
</table>
</form>
卻發(fā)現(xiàn)并沒有觸發(fā)form的onsubmit方法,而是直接提交了。奇怪了,難道沒有這種方式無法結(jié)合form的onsubmit方法嗎?
仔細(xì)想了想,既然this.form表示form這個(gè)對象,那么肯定能獲取到form的屬性和方法的
,就改成this.form.onsubmit(); 成功!
我又查了查手冊,原來submit的方法是這樣解釋的:
The submit method does not invoke the onsubmit event handler. Call the onsubmit event handler directly. When using Microsoft? Internet Explorer 5.5 and later, you can call the fireEvent method with a value of onsubmit in the sEvent parameter.
意思是說submit這個(gè)方法是不觸發(fā)onsubmit時(shí)間的,如果想要觸發(fā)它,需要調(diào)用
fireEvent方法。嘗試一下:this.form.fireEvent('onsubmit');哈哈,果然也成功!不過這樣不是多此一舉嗎?呵呵!
就這個(gè)小問題也搞了我將近一個(gè)小時(shí),不過為了以后不為這個(gè)問題煩惱,這也是值得的。
this.form.submit(); //直接提交表單
this.form.onsubmit(); //調(diào)用form的onsubmit方法
this.form.fireEvent('onsubmit'); //同上,
PS:又學(xué)到了fireEvent這個(gè)方法,
2.onsubmit()與submit() :
<sCript>
funCtion fun()
{
alert("form_submit");
}
</sCript>
<form onsubmit="fun()">
<input type="submit" id="aaa" value="submit"> <!--能彈出form_submit-->
<input type="button" id="bbb" value="onCliCk_submit" onCliCk="doCument.forms[0].submit()">
<!--
表單會提交,但是不會運(yùn)行fun() 原因是 onsubmit事件不能通過此種方式觸發(fā)(在IE環(huán)境)
直接用腳本doCumetn.formName.submit()提交表單是不會觸發(fā)表單的onsubmit()事件的
-->
<input type="button" id="bb1" value="onCliCk_onsubmit" onCliCk="doCument.forms[0].onsubmit()">
<!--會觸發(fā)fun()參數(shù)-->
</form>