javascript當中表單提交（空格提交的問題）

表單提交（空格提交的問題）
馬克- to-win：馬克 java社區(qū)：防盜版實名手機尾號： 73203。

例 4.1（form.submitIEFF.html）

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <script language=javascript>
        function check()
        {
            var form = document.getElementById("regForm");
            if (form.user.value == "")
            {
                alert("用戶名不能為空!");
            }
            else
            {
                form.submit();
            }
        }
    </script>
    <form method=post id="regForm" action="jsp1.jsp">
        用戶<input type="text" name="user"/><br>
        <INPUT TYPE="button" onclick="check();" id="regBut" value="提交"/>
    </form>

馬克-to-win：以上例子很好，但有個問題，當光標放在文本框里時，即使空格，回車也會提交。不信你試試，瀏覽器（IE和火狐）都這樣。下面給出解決辦法。




例 4.1_a

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <script language=javascript>
        function check()
        {
            var form = document.getElementById("regForm");
            if (form.user.value == "")
            {
                alert("用戶名不能為空!");
            }
            else
            {
                form.submit();
            }
        }
    </script>
    <form method=post id="regForm" action="jsp1.jsp">
        用戶<input type="text" name="user" onkeydown="if(event.keyCode==13) return false;"/><br>
        <INPUT TYPE="button" onclick="check();" id="regBut" value="提交"/>
    </form>

或者用下面的例子，里面用了onSubmit，只要提交，它就會被執(zhí)行。




例 4.2（onSubmitReturnIEFF.html）


<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <script language=javascript>
        function check(form)
        {
            /*onSubmit (Event handler)
             The user has clicked on the submit button in a form.
             Property/method value type:    Boolean primitive
             JavaScript syntax:    -    myObject.onsubmit = aHandler
             HTML syntax:    <FORM onSubmit="..."> <HTMLTag onSubmit="...">
             As the <FORM> submit button is clicked, this event is triggered.If you return the value true, the event will be passed to the browser for further processing and the form will be submitted.
             Returning false inhibits this action and discards the message;
             the form will not be submitted. This provides a means of
             inhibiting <FORM> submits when the form data is bad.
*/
            if (form.user.value == "")
            {
                alert("用戶名不能為空!");
                return false;
            }
            return true;
       }
    </script>

    <!-- As of version 1.1 of JavaScript, if the handler returns the Boolean false value then the browser will not follow the link to its HREF. If a true value is returned then it will.
    -->
    <a href="http://www.baidu.com" onClick="return false;">百度不跳轉(zhuǎn)</a>
    <!--
    Window.confirm() (Method)
    Present a confirmation dialog box.

    Property/method value type: Boolean primitive
    JavaScript syntax: - myResult = confirm(aString)
    - myResult = myWindow.confirm(aString)
    Argument list: aString Some text to explain what is to be confirmed

    -->
    <a href="http://www.baidu.com" onClick="return confirm('是否轉(zhuǎn)向？');">百度</a>
    <form method=post onSubmit="return check(this);"  action="jsp1.jsp">
        用戶名：<input type="text" name="user"/><br>
        <INPUT TYPE="submit" value="提交"/>
    </form>




例 4.3（onSubmitReturn1IEFF.html）



<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <script language=javascript>
        function check(event)
        {
           var event = event||window.event;
/*火狐用event.target，ie用event.srcElement，注意是表單的提交方法，target.onsubmit= check;，所以event.target是表單。*/
           var form =event.srcElement||event.target;


            if (form.user.value == "")
            {
                alert("用戶名不能為空!");
                return false;
            }
           return true;
        }
    </script>
    <form method=post id="register" name="register" action="jsp1.jsp">
        用戶名：<input type="text" name="user"/><br>
        <INPUT TYPE="submit" value="提交"/>
    </form>
<script>
    var target = document.getElementById("register");
    target.onsubmit = check;
</script>