使用JQuery设置名为“required”的属性和任何值都不起作用

Question

这不起作用：

$("#elementId").attr("required", "true");

在Chrome和Firefox中，DOM都会生成required属性（无值）或required="" （空值）。

并且这个例子中的值是“真”并不重要。 如果你尝试“asdf”同样的事情发生。

奇怪的是，我相信这曾经发挥作用，因为这个新代码是一个持续了好几年的大型项目的一部分。

我唯一能想到的是我的Chrome（v10）和Firefox（v4）现在都已经足够先进，他们将所需属性识别为HTML5保留关键字。 我添加了novalidate属性，认为这可能会关闭任何与表单相关的HTML5。 没有这样的运气。

思考？

编辑：

为了澄清，这只发生在JQuery上。 如果我这样说，它有效：

$("#elementId")[0].setAttribute("required", "true");

JQuery中有错误吗？ 知道为什么这只发生在JQuery上吗？ 我们的开发团队喜欢所有代码，尽可能通过JQuery。 我可以使用直接的setAttribute JavaScript方法，但宁可使用可行的JQuery解决方案。

编辑2：

问题的症结在于......

为什么在常规setAttribute()方法中使用JQuery的attr() setAttribute()方法不起作用？ attr()方法是否在某些时候调低setAttribute() ？

这就是令人困惑的事情。 如果你使用setAttribute（），Chrome和Firefox是完美的设置required="true" 。

Answer 1

您可以使用prop来实现此目的：

$("#elementId").prop("required", true);

相应文档： http ： //jquery.com/upgrade-guide/1.9/#attr-versus-prop-

Answer 2

它确实与浏览器有关。 我检查了IE8，它将应用您设置的任何字符串值到必需的属性。

由于您不需要任何值（仅必须存在该属性），因此不会影响默认行为。 如果你滥用javascript钩子的属性值，这是另一回事:)

<input required>与<input required="">和<input required="honky-tonk">

由于IE8不支持html5，它就像设置一个$("input").attr("derp", "derty")属性，所以你可以设置$("input").attr("derp", "derty")并将它分配给元素。

我的猜测是jquery对希望在XHTML严格语法中使用它的人使用required="" ，同时仍然符合HTML5标准。

http://dev.w3.org/html5/spec/Overview.html#the-required-attribute

http://dev.w3.org/html5/spec/Overview.html#boolean-attribute

Answer 3

我得到这个工作的方式是实现以下好的旧javascript代替任何jQuery ：

document.getElementById("inputid").required = true;

或者，（显然）

document.getElementById("inputid").required = false;

根据要求。

我的解决方案的来源就在这里。

我已经阅读了jQuery API上的.attr（）和.prop（）页面，并且似乎不支持“required”属性 - 但我愿意更正。

Answer 4

我经常使用它，我没有发现任何问题。

$("#elementId").attr("required", "required");

注意：我试过这个，但我无法让它工作：

$("#elementId").attr("required");

尽管现在需要的是布尔属性，但只是添加属性名称（没有值）似乎与不同浏览器的不同版本不兼容。 坚持我上面的原始例子你应该没事。

Answer 5

对于所需的输入，如果删除属性与将其设置为false，则效果会更好

 $('#elementId').removeAttr('required');