Question

我是一个想要学习创建表单页面的新手。有人能告诉我为什么提交按钮不起作用？我认为有javascript函数会解决这个问题。感谢

<script type="text/javascript">
function submitform()
{
document.forms["contactform"].submit();
}

</head>
<body>

        <div id="contact-form">
                       <form method="POST" id="contactform" action="bespoke-form-handler.php">
                            <div>
                                <label for="name">Name:</label>
                                <input type="text" id="name" name="user_name" />
                            </div>
                            <div>
                                <label for="mail">E-mail:</label>
                                <input type="email" id="mail" name="user_email" />
                            </div>


                            <div class="button">
                                <button type="submit" name="submit"><a href="javascript: submitform()">Submit</a></button>
                            </div>
                        </form>
<script language="JavaScript">
var frmvalidator  = new Validator("contactform");
frmvalidator.addValidation("name","req","Please provide your name"); 
frmvalidator.addValidation("mail","req","Please provide your email"); 
frmvalidator.addValidation("mail","email","Please enter a valid email address"); 
</script>

</body>

Answer 1

问题是按钮名称，因为您已将其用作submit，document.forms["contactform"].submit将引用元素而非提交方法，因此会导致错误，如Uncaught TypeError: document.forms.contactform.submit is not a function

<button type="submit" name="someothername"><a href="javascript: submitform()">Submit</a></button>

演示：Problem，Solution

Answer 2

在<a>标记内添加<button>标记是没有意义的，因为它会阻止通过提交按钮自动完成的标准HTML表单提交，只需将其删除即可。

您也不需要第一个JavaScript函数来提交表单，提交按钮可以解决此问题。

Answer 3

将提交按钮更改为

<input type="submit" name="submit" />

无法点击提交按钮

3 个答案: