html形式：-onsubmit js函數被調用兩次

Question

以下是我從html頁面源獲取的源：

<FORM id=SubmitLogon onsubmit="return validateLoginCredentials()" method=post name=submitLogonForm action=/MyLogin/SubmitLogon.do;jsessionid=s5EXXp3uylxmT10IrEqjlq142HWdNeb-qbeY_q-bTTG2SiuVpY_1!-1968082838 AutoComplete="off">
    <TR>
        <TD class=logonLabelTdTag>Username&nbsp; </TD>
        <TD align=left>
            <DIV id=wwgrp_SubmitLogon_username class=wwgrp>
                <DIV id=wwctrl_SubmitLogon_username class=wwctrl>
                    <INPUT onchange="javascript: this.value=this.value.toUpperCase();" tabIndex=1 onfocus="javascript: this.value=this.value.toUpperCase();" id=SubmitLogon_username class=logonTextBox maxLength=40 name=username>
                </DIV>
            </DIV>
        </TD>
    </TR>

    <TR>
        <TD class=logonLabelTdTag>Password&nbsp; </TD>
        <TD align=left>
            <DIV id=wwgrp_SubmitLogon_password class=wwgrp>
                <DIV id=wwctrl_SubmitLogon_password class=wwctrl>
                    <INPUT tabIndex=2 id=SubmitLogon_password class=logonTextBox maxLength=40 type=password value="" name=password>
                </DIV>
            </DIV>
        </TD>
    </TR>

    <TR>
        <TD colSpan=2 align=right>
            <BUTTON onclick=validateLoginCredentials() style="BORDER-TOP-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: 39px; WIDTH: 98px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-STYLE: none; BORDER-RIGHT-STYLE: none" type=submit value="Login">
                            <IMG src="/images/btn_login.jpg">
                            </BUTTON>
        </TD>
    </TR>
</FORM>
<script>
    function validateLoginCredentials() {
        alert('invoked---');
    }
</script>

當我單擊提交按鈕時，函數validateLoginCredentials()被調用兩次（我通過調用alert('invoked---')注意到了這一點）。

為什么會這樣呢？

Answer 1

因為您要調用它兩次，所以在按鈕單擊事件和在表單提交事件上。 避免任何一個繼續進行。

干杯。

Answer 2

只需從登錄按鈕中刪除onclick=validateLoginCredentials()即可解決問題。

背景：問題是您要告訴表單在提交表單時執行validateLoginCredentials()函數。 並且由於您的登錄按鈕具有type="submit" event type="submit"的type="submit"屬性，因此validateLoginCredentials()被調用兩次，一次是提交事件，另一次是onclick事件。

Answer 3

是的，正如Sudheesh所說。

您需要刪除

onclick=validateLoginCredentials()

要么

 type=submit 

當您將按鈕類型設置為提交時，它會自動提交表單，而無需添加任何onclick方法-這就是為什么它被調用兩次的原因。 如果要覆蓋默認行為，可以考慮其他onclick方法。

我建議刪除

onclick=validateLoginCredentials()

因為這是最常用的做法。

干杯。