jQuery添加所需的输入字段

Posted 2023-02-22

【中文标题】jQuery添加所需的输入字段

【英文标题】：jQuery add required to input fields

【发布时间】：2013-10-10 14:15:01

【问题描述】：

我一直在寻找方法让 jQuery 使用 html5 验证自动向我的所有输入字段写入所需的内容，但我无法告诉它在哪里写入。

我想要这个

 <input type="text" name="first_name" value="" id="freeform_first_name"
 maxlength="150">

并让它在结束标记之前自动添加 required

 <input type="text" name="first_name" value="" id="freeform_first_name"
 maxlength="150" required>

我想我可以做一些类似的事情

$("input").attr("required", "true");

但它不起作用。任何帮助是极大的赞赏。

【问题讨论】：

是不是包裹在dom里准备好了？ $(function()....);

我正在使用这个jsfiddle.net/japaneselanguagefriend/LEZ4r

如果 'input' 是一个 id，则 jquery 在此处的选择器中缺少 #。

@JohnMeyer "input" 是一个标签选择器。如果定位输入标签，则不需要 #

【参考方案1】：

$("input").prop('required',true);

DEMO FIDDLE

【讨论】：

嗯，添加了一个提交按钮，但仍未验证或向输入字段添加必需的属性。 jsfiddle.net/japaneselanguagefriend/LEZ4r

@JohnMeyer "input" 是一个标签选择器

收到TypeError: element.prop is not a function 错误

@Miura-shi 你的 jsFiddle 中缺少 <form></form> 标签

如果它可以帮助某人：起初这对我不起作用，因为我在输入上调用.prop('required',true)之前调用.css("display", "block")。跨度>

【参考方案2】：

您可以使用 attr 来做到这一点，您犯的错误是您将 true 放在引号内。而不是这样尝试：

$("input").attr("required", true);

【讨论】：

@JohnMeyer "input" 是标签选择器的名称

required 是一个 boolean 属性，只能省略（对于“false”），或者具有与其名称相同的值（即"required"） “真的”。其实还是用.prop()比较好。

@Alnitak 不是，如果您正在制作一个与 IE 兼容的网站，prop() 就不能像在现代浏览器上那样工作。还是最好用$(ele).attr("required", true)和false来删除。

【参考方案3】：

我发现 jquery 1.11.1 不能可靠地做到这一点。

我使用了$('#estimate').attr('required', true) 和$('#estimate').removeAttr('required')。

删除 required 并不可靠。它有时会使required 属性没有价值。由于required 是一个布尔属性，它的存在，没有价值，被浏览器视为true。

这个错误是间歇性的，我厌倦了把它弄乱。切换到document.getElementById("estimate").required = true 和document.getElementById("estimate").required = false。

【讨论】：

removeAttr 对我不起作用。然后我使用您的解决方案并且工作正常。谢谢！

【参考方案4】：

我发现以下实现是有效的：

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

$('#freeform_first_name').attr('required', 'required');

这些命令（attr、removeAttr、prop）的行为因您使用的 JQuery 版本而异。请参考这里的文档：https://api.jquery.com/attr/

【参考方案5】：

不应将 true 括在 双引号 " " 它应该像

$(document).ready(function()             
   $('input').attr('required', true);   
);

你也可以使用道具

jQuery(document).ready(function()             
   $('input').prop('required', true);   
); 

您可以尝试要求，而不是 true。比如

$('input').prop('required', 'required');

【参考方案6】：

使用.attr方法

.attr(attribute,value); // syntax

.attr("required", true);
// required="required"

.attr("required", false);
// 

使用.prop

.prop(property,value) // syntax

.prop("required", true);
// required=""

.prop("required", false);
//

从这里阅读更多内容

https://***.com/a/5876747/5413283