Javascript 使用 JQuery 设置名为“required”的属性和任何值都不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5781355/
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
Setting an attribute named "required" and any value, with JQuery, doesn't work
提问by sohtimsso1970
This doesn't work:
这不起作用：
$("#elementId").attr("required", "true");
In both Chrome and Firefox, the DOM produces either requiredas the attribute (no value) or required=""(empty value).
在 Chrome 和 Firefox 中，DOM 生成required属性（无值）或required=""（空值）。
And it doesn't matter that the value in this example is "true". If you try "asdf" the same thing happens.
并且本示例中的值是否为“true”并不重要。如果您尝试“asdf”，也会发生同样的事情。
What's odd is that I believe this usedto work because this new code is part of a large project that's been ongoing for several years.
奇怪的是，我相信这曾经是有效的，因为这个新代码是一个已经进行了好几年的大型项目的一部分。
The only thing I can think of is that my Chrome (v10) and Firefox (v4) are now both sufficiently advanced that they're recognizing the requiredattribute as an HTML5 reserved keyword. I added the novalidateattribute, thinking that that might turn off any form-related HTML5-ness. No such luck.
我唯一能想到的是我的 Chrome (v10) 和 Firefox (v4) 现在都足够先进，它们将required属性识别为 HTML5 保留关键字。我添加了novalidate属性，认为这可能会关闭任何与表单相关的 HTML5 特性。没有这样的运气。
Thoughts?
想法？
Edit:
编辑：
To clarify, this only happens with JQuery. If I say this, it works:
澄清一下，这只发生在 JQuery 中。如果我这样说，它会起作用：
$("#elementId")[0].setAttribute("required", "true");
Is there a bug in JQuery? Any idea why this only happens with JQuery? Our development team likes all code to go through JQuery where possible. I can use the straight setAttribute JavaScript method, but would rather use a JQuery solution that works.
JQuery 中是否存在错误？知道为什么这只发生在 JQuery 上吗？我们的开发团队希望所有代码尽可能通过 JQuery。我可以直接使用 setAttribute JavaScript 方法，但更愿意使用有效的 JQuery 解决方案。
Edit 2:
编辑2：
The crux of the matter is this...
问题的关键是...
Why does using JQuery's attr()method not work when the regular setAttribute()method does? Doesn't the attr()method call setAttribute()at some point lower down?
为什么使用 JQuery 的attr()方法在常规setAttribute()方法不起作用时不起作用？attr()方法调用不会setAttribute()在某个时候降低吗？
That is what is so confusing. Chrome and Firefox are perfectly fine setting required="true"if you use setAttribute().
这就是如此令人困惑的原因。required="true"如果您使用 setAttribute()，Chrome 和 Firefox 是完美的设置。
采纳答案by Wesley Murch
It is indeed browser related. I checked in IE8 and it will apply whatever string value you set to the required attribute.
它确实与浏览器有关。我检查了 IE8，它将应用您为所需属性设置的任何字符串值。
Since you don't need any value (only the attribute must be present), this won't affect default behavior. If you are abusing the attribute value for javascript hooks, that's another thing :)
由于您不需要任何值（只有属性必须存在），因此这不会影响默认行为。如果您滥用 javascript 钩子的属性值，那是另一回事:)
<input required>is the same as <input required="">and <input required="honky-tonk">
<input required>与<input required="">和相同<input required="honky-tonk">
Since IE8 doesn't support html5, it's just like setting a made-up attribute, so you could set $("input").attr("derp", "derty")and it would assign it to the element.
由于 IE8 不支持 html5，它就像设置一个虚构的属性，因此您可以设置$("input").attr("derp", "derty")它并将其分配给元素。
My guess is that jquery uses the required=""for folks who wish to use this in XHTML strict syntax, while still conforming to HTML5 standards.
我的猜测是 jqueryrequired=""为那些希望在 XHTML 严格语法中使用它的人使用 ，同时仍然符合 HTML5 标准。
http://dev.w3.org/html5/spec/Overview.html#the-required-attribute
http://dev.w3.org/html5/spec/Overview.html#the-required-attribute
http://dev.w3.org/html5/spec/Overview.html#boolean-attribute
http://dev.w3.org/html5/spec/Overview.html#boolean-attribute
回答by toutpt
You can use prop to achieve this:
您可以使用 prop 来实现这一点：
$("#elementId").prop("required", true);
Corresponding documentation: http://jquery.com/upgrade-guide/1.9/#attr-versus-prop-
对应文档：http: //jquery.com/upgrade-guide/1.9/#attr-versus-prop-
回答by collyg
The way I got this working was to implement the following good old javascriptin place of any jQuery:
我让这个工作的方式是实现以下好的旧 javascript代替任何jQuery：
document.getElementById("inputid").required = true;
or, (obviously)
或者，（显然）
document.getElementById("inputid").required = false;
depending on requirements.
取决于要求。
The source of my solution is here.
I have read through .attr() and .prop() pages on the jQuery API, and there seems to be no support for the "required" attribute - but I am open to correction.
我已经通读了 jQuery API 上的 .attr() 和 .prop() 页面，似乎不支持“必需”属性 - 但我愿意纠正。
回答by rdaniels
For input required, it works much better if you remove the attribute vs. setting it to false
对于需要输入，如果删除属性与将其设置为 false 相比，效果会更好
$('#elementId').removeAttr('required');回答by Randy Greencorn
I use this fairly often and I haven't noticed any problems with it.
我经常使用它，我没有注意到它有任何问题。
$("#elementId").attr("required", "required");
Note: I have try this but I could NOT get it working:
注意：我试过这个，但我无法让它工作：
$("#elementId").attr("required");
Even though required is now a boolean attribute, simply adding the attribute name (without the value) does not appear to be too compatible with different versions of different browsers. Stick with my original example above and you should be fine.
尽管 required 现在是一个布尔属性，但简单地添加属性名称（不带值）似乎与不同浏览器的不同版本不太兼容。坚持我上面的原始例子，你应该没问题。
