jQuery 提交时绕过 HTML“必需”属性
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18725078/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bypass HTML "required" attribute when submitting
提问by Horst Walter
I use required
for a 1st check before submitting a form.
我required
在提交表单之前用于第一次检查。
<form action="myform.php">
Foo: <input type="text" name="someField" required="required">
<input type="submit" value="submit">
<input type="submit" value="ignore">
</form>
Problem is, that I have an "ignore" button, which submits the form as well and the backend logic then sets a correct state in a DB. In this case (ignore) the validation is not desired (because there is no need to fill in field "Foo").
问题是,我有一个“忽略”按钮,它也提交表单,然后后端逻辑在数据库中设置正确的状态。在这种情况下(忽略)不需要验证(因为不需要填写字段“Foo”)。
What's the best way to handle the 2 scenarios?
处理这两种情况的最佳方法是什么?
- I am aware that I could give up "required" and do the validation somewhere else (backend / JavaScript). I am looking for a way to keep the "required".
- I could use some Js
onclick
for the ignore button scenario and remove the attribute just before sending the form ( https://stackoverflow.com/a/13951500/356726).
- 我知道我可以放弃“必需”并在其他地方(后端/JavaScript)进行验证。我正在寻找一种保持“必需”的方法。
- 我可以
onclick
在忽略按钮场景中使用一些 Js并在发送表单之前删除该属性(https://stackoverflow.com/a/13951500/356726)。
But actually I am looking for something smarter ....
但实际上我正在寻找更聪明的东西......
--- Edit ---
- - 编辑 - -
Yes, duplicate of Required attribute HTML5
是的,必需属性 HTML5 的重复项
回答by Bergi
No JavaScript, no second form needed, and the validation can stay:
没有 JavaScript,不需要第二个表单,验证可以保留:
For exactly this use case the HTML5 spec has designed the formnovalidate
attributefor submit elements (like <input type=submit>
), as one of the attributes for form submission:
正是这种情况下,使用HTML5规范设计了formnovalidate
属性为提交元素(如<input type=submit>
),作为一个表单提交的属性:
The
formnovalidate
attribute can be used to make submit buttons that do not trigger the constraint validation.
该
formnovalidate
属性可用于制作不触发约束验证的提交按钮。
So simply put
所以简单地说
<form action="myform.php">
Foo: <input type="text" name="someField" required>
<input type="submit" value="submit">
<input type="submit" value="ignore" formnovalidate>
</form>
回答by isherwood
Your #2 is a common approach. Something like:
你的#2 是一种常见的方法。就像是:
$('input[value="ignore"]').click(function() {
$(this).siblings('input[type="text"]').removeAttr('required');
});
Might have to use mousedown to beat submit.
可能必须使用 mousedown 来击败提交。
回答by Matt Kenefick
If you don't want to use Javascript, you could make them separate forms and have all the inputs set to hidden for the ignore
form.
如果您不想使用 Javascript,您可以将它们设为单独的表单,并将表单的所有输入设置为隐藏ignore
。
Not the best option, but it is an alternative.
不是最好的选择,但它是另一种选择。
回答by Jukka K. Korpela
You should use approach #1 on the following grounds: The main reasons for using required
instead of JavaScript validation is that it is simpler and it works even when JavaScript is disabled. Here the simplicity does not apply, since the use of required
makes things more difficult. And the latter reason does not apply either: with JavaScript disabled and the browser supporting required
, the “ignore” button does not work unless some data is entered in the textfield.
您应该基于以下理由使用方法 #1: 使用required
而不是 JavaScript 验证的主要原因是它更简单,即使禁用 JavaScript 也能工作。这里的简单并不适用,因为使用required
使事情变得更加困难。后一个原因也不适用:在禁用 JavaScript 且浏览器支持 的情况下required
,除非在文本字段中输入一些数据,否则“忽略”按钮不起作用。
Another alternative is the one mentioned on @MattKenefick's answer. It might even result in simpler structure and logic. If the form is really as simple as in the example, it is straightforward to split it to two forms:
另一种选择是@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>