最近在開發(fā)中遇到了表單提交前驗(yàn)證的問題,用一個普通的button按鈕代替submit按鈕,
在提交前觸發(fā)這個button的onclick事件,在其事件中觸發(fā)form的submit事件。問題出現(xiàn)了:
以下是出現(xiàn)相關(guān)代碼:
<form action="http://www.baidu.com/s?wd=this.form.submit%28%29%3B&cl=3" method="post" name="form1" onsubmit="return alert('已提交!'); return false;">
<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這個對象,那么肯定能獲取到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這個方法是不觸發(fā)onsubmit時間的,如果想要觸發(fā)它,需要調(diào)用
fireEvent方法。嘗試一下:this.form.fireEvent('onsubmit');哈哈,果然也成功!不過這樣不是多此一舉嗎?呵呵!
就這個小問題也搞了我將近一個小時,不過為了以后不為這個問題煩惱,這也是值得的。
this.form.submit(); //直接提交表單
this.form.onsubmit(); //調(diào)用form的onsubmit方法
this.form.fireEvent('onsubmit'); //同上,
PS:又學(xué)到了fireEvent這個方法,
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>