Question

我有表单，我的sumbit按钮不在此表格中（在我的网站右侧 - 预订按钮）所以我使用formSubmit（）来调用此表单的ID。我决定使用html5并且必需，因为用户必须定义他们的信息，如姓名，电子邮件......

这是代码：

<script>
    function formSubmit()
     {

     document.getElementById("reservation").submit();

     }
    </script>

    and my form

    <form method='post' action='mail.php' id='reservation' >
    <input required type='text' name='from' id='FadeMeIna' size='6'  />
    <input required type='text' name='to' id='FadeMeInb' size='6' />
    <input required type='text' name='email' id='formdetail'  value='' size='16'  />
    </form>

    this is my submit button in a new div 

    <p type="submit" style="display:none;" onclick="formSubmit();" /> <a href="#">Rezervovať</a></p>

我的问题是需要它不起作用我正在寻找解决方案，但我没有找到任何东西

感谢您的帮助

Answer 1

Required确实有效，正如您在此jsfiddle上看到的那样，我已经使用您的表单和提交按钮创建了

http://jsfiddle.net/d3Y25/

所以也许你的问题是你绕过基于浏览器的那个字段检查，并用脚本创建你自己的提交函数。因此，当用户按下提交按钮时，它会执行您要求的操作 - 通过脚本提交表单。

如果您使用基于表单的提交选项，则可以按预期使用HTML5必需属性。如果不是，我猜你需要在提交之前检查这些字段是否通过JS填充。

Answer 2

您的问题是交互式表单验证仅在用户交互时完成（按输入中的输入或单击提交按钮。您目前无法使用表单api来实现此目的。（但有一些称为reportValidity。）

好消息是，HTML5还为您提供了表单内容属性。

<form method='post' action='mail.php' id='reservation' >
    <input required type='text' name='from' id='FadeMeIna' size='6'  />
    <input required type='text' name='to' id='FadeMeInb' size='6' />
    <input required type='email' name='email' id='formdetail'  value='' size='16'  />
</form>


<button type="submit" form="reservation" />Rezervovať</button>

以下是演示：http://jsfiddle.net/trixta/fP72G/

必需和formSubmit（）并发症

2 个答案: