31

我required在提交表格之前进行第一次检查。

<form action="myform.php">
  Foo: <input type="text" name="someField" required="required">
  <input type="submit" value="submit">
  <input type="submit" value="ignore">
</form>

问题是，我有一个“忽略”按钮，它也提交表单，然后后端逻辑在数据库中设置正确的状态。在这种情况下（忽略）不需要验证（因为不需要填写“Foo”字段）。

处理这两种情况的最佳方法是什么？

  1. 我知道我可以放弃“必需”并在其他地方（后端/JavaScript）进行验证。我正在寻找一种方法来保持“必需”。
  2. 我可以在忽略按钮场景中使用一些 Js ，并在发送表单（ https://stackoverflow.com/a/13951500/356726onclick ）之前删除该属性。

但实际上我正在寻找更聪明的东西....

- - 编辑 - -

是的，必需属性 HTML5的副本

4

4 回答 4

102

不需要 JavaScript，不需要第二个表单，并且验证可以保留：

对于这个用例，HTML5 规范设计了提交元素的formnovalidate属性<input type=submit>（如），作为表单提交的属性之一：

该formnovalidate属性可用于制作不触发约束验证的提交按钮。

所以简单地说

<form action="myform.php">
  Foo: <input type="text" name="someField" required>
  <input type="submit" value="submit">
  <input type="submit" value="ignore" formnovalidate>
</form>
于 2013-09-10T19:57:03.400 回答
5

你的＃2是一种常见的方法。就像是：

$('input[value="ignore"]').click(function() {
    $(this).siblings('input[type="text"]').removeAttr('required');
});

可能必须使用 mousedown 来击败提交。

于 2013-09-10T17:39:23.913 回答
1

如果您不想使用 Javascript，您可以将它们制作成单独的表单，并将所有输入设置为隐藏ignore表单。

不是最好的选择，但它是另一种选择。

于 2013-09-10T18:23:51.507 回答
1

您应该基于以下理由使用方法 #1： 使用而不是 JavaScript 验证的主要原因required是它更简单，即使在禁用 JavaScript 时也可以工作。在这里，简单性并不适用，因为使用required会使事情变得更加困难。后一个原因也不适用：在禁用 JavaScript 且浏览器支持required的情况下，“忽略”按钮不起作用，除非在文本字段中输入一些数据。

另一种选择是@MattKenefick 的回答中提到的那个。它甚至可能导致更简单的结构和逻辑。如果表单真的像示例中那样简单，那么直接将其拆分为两种形式：

<form action="myform.php">
  Foo: <input type="text" name="someField" required="required">
  <input type="submit" value="submit">
</form>
<form action="myform.php">
  <input type="submit" value="ignore">
</form>
于 2013-09-10T19:15:21.333 回答