1

我想在空输入到表单元素后添加光标。第一个空表格在哪里。
带着这个目标，我尝试添加this.focus();功能validate()。但这并没有成功。

第二点 - 如何在浏览器出现页面后将光标设置为第一个表单元素。我尝试将此目标onLoad();方法用于body. 但这并没有成功。

代码：

<html>
    <head>
        <title>Form with check</title>
            <script>
                function validate() {
                    if(document.form1.yourname.value.length < 1) {
                        alert("Enter your name, please");
                        this.focus();
                        return false;
                    }
                    if(document.form1.adress.value.length < 3) {
                        alert("Enter your adress, please");
                        this.focus();
                        return false;
                    }
                    if(document.form1.phone.value.length < 3) {
                        alert("Enter your phone number, please");
                        this.focus();
                        return false;
                    }
                    return true;
                }
            </script>
    </head> 
        <body>
            <h1>Form with check</h1>
            <p>Input all data. When button Submit pushed data will be sent as message.</p>  
                <form name="form1" action="mailto:user@host.com" enctype="text/plain"
                onSubmit="validate();">
                    <p><b>Name:</b><input type="text" length="20" name="yourname">
                    </p>
                    <p><b>Adress:</b><input type="text" length="20" name="adress">
                    </p>
                    <p><b>Phone:</b><input type="text" length="20" name="phone">
                    </p>
                    <input type="SUBMIT" value="Submit">                    
            </form>
            onLoad();
        </body>    
</html>

问题：

  • 如何将此功能添加到表单？
4

3 回答 3

1

你没忘记做

onSubmit="return validate();" ?
于 2013-04-08T08:20:28.457 回答
1

替换this.focus()为document.form1.yourname.focus();

这是重新设计的代码：

<html>
    <head>
        <title>Form with check</title>
            <script>
                function validate() {
                    if(document.form1.yourname.value.length < 1) {
                        alert("Enter your name, please");
                        document.form1.yourname.focus();
                        return false;
                    }
                    if(document.form1.adress.value.length < 3) {
                        alert("Enter your adress, please");
                       document.form1.adress.focus();
                        return false;
                    }
                    if(document.form1.phone.value.length < 3) {
                        alert("Enter your phone number, please");
                        document.form1.phone.focus();
                        return false;
                    }
                    document.getElementById("ff").submit();
                    return true;

                }
            </script>
    </head> 
        <body >
            <h1>Form with check</h1>
            <p>Input all data. When button Submit pushed data will be sent as message.</p>  
                <form id="ff" name="form1" action="mailto:user@host.com" enctype="text/plain"
                >
                    <p><b>Name:</b><input type="text" length="20" name="yourname">
                    </p>
                    <p><b>Adress:</b><input type="text" length="20" name="adress">
                    </p>
                    <p><b>Phone:</b><input type="text" length="20" name="phone">
                    </p>
                    <input type="button" value="Submit" onclick="validate();">                    
            </form>

        </body>    
</html>

还有工作演示

于 2013-04-08T08:20:39.950 回答
0 
onSubmit="validate();"

在您的验证函数的上下文this中将是全局窗口对象。

要在函数中处理表单，根据您的代码，您可以使用document.form1或通过 id（或其他选择器）手动调用它，或者您可以将表单发送到函数：

  <script>
        function validate(sender) {
            if(sender.yourname.value.length < 1) {
                alert("Enter your name, please");
                sender.focus();
                return false;
            }
            if(sender.adress.value.length < 3) {
                alert("Enter your adress, please");
                sender.focus();
                return false;
            }
            if(sender.phone.value.length < 3) {
                alert("Enter your phone number, please");
                sender.focus();
                return false;
            }
            return true;
        }
    </script>
    <form name="form1" action="mailto:user@host.com" enctype="text/plain" onSubmit="validate(this);">
        <p>
           <b>Name:</b><input type="text" length="20" name="yourname">
        </p>
        <p>
           <b>Adress:</b><input type="text" length="20" name="adress">
        </p>
        <p>
           <b>Phone:</b><input type="text" length="20" name="phone">
        </p>
        <input type="SUBMIT" value="Submit">                    
   </form>
于 2013-04-08T08:44:22.603 回答