如何向 <input> 添加“只读”属性？

IT技术 javascript jquery
2021-01-29 05:30:23

如何添加readonly到特定的<input>？.attr('readonly')不起作用。

6个回答

jQuery <1.9

$('#inputId').attr('readonly', true);

jQuery 1.9+

$('#inputId').prop('readonly', true);

阅读更多关于prop 和 attr 之间的区别

readonly 属性是一个“布尔属性” ——whatwg.org/specs/web-apps/current-work/#boolean-attribute 尽管名称有点误导，但值不应是“true”或“false”。虽然我认为上面的代码实际上可以工作（在 Chrome 中使用 jQuery 1.8.1 进行测试），但它可能会导致没有经验的人日后混淆。此外，根据 jQuery 文档，值应该是数字或字符串，而不是布尔值。api.jquery.com/attr/#attr2
2021-03-16 05:30:23
你确定吗？我也这么认为，但在规格中找不到任何相关信息。<input name="foo" readonly="readonly" value="bar" /> 在 validator.w3.org 和 xhtml 1.0 严格验证。
2021-03-19 05:30:23
这篇文章应该更改为 .prop() 而不是 .attr()，如 jQuery API 中所述：jquery.com/upgrade-guide/1.9/#attr-versus-prop-
2021-03-19 05:30:23

使用$.prop()

$("#descrip").prop("readonly",true);

$("#descrip").prop("readonly",false);
每个人都应该使用这个答案，如下所述：jquery.com/upgrade-guide/1.9/#attr-versus-prop-
2021-03-18 05:30:23
使用$.prop(): Prop的注意事项： Prop 会将 readonly 属性设置为空白/空字符串，因此如果您有任何使用 属性选择器的 CSS [readonly="readonly"]，那么您必须将其更改为[readonly]（或同时包含两者）。
2021-03-20 05:30:23
阅读 jQuery API for .prop 后，这应该是公认的答案。过去我总是使用 .attr('readonly', 'readonly') 和 .removeAttr('readonly') ，但这似乎更正确，也使代码更清晰。
2021-03-29 05:30:23

Readonly 是 html 中定义的属性，因此将其视为一个属性。

如果您希望它不可编辑，您需要在您正在使用的对象中使用类似 readonly="readonly" 的内容。如果您希望它再次可编辑，则不会有 readonly='' 之类的东西（如果我理解正确，这不是标准的）。您确实需要整体删除该属性。

因此，在使用 jquery 时添加和删除它是有意义的。

设置只读：

$("#someId").attr('readonly', 'readonly');

删除只读：

$("#someId").removeAttr('readonly');

这是唯一对我有用的选择。希望能帮助到你！

.attr('readonly', 'readonly')应该做的伎俩。你.attr('readonly')只返回值，它没有设置一个。

我认为您不想将该属性设置为“true”。.attr根据 jQuery 文档，该值应该只是一个字符串或数字，而不是一个布尔值：api.jquery.com/attr/#attr2此外，HTML“布尔属性”应该只是空字符串或属性值。我认为解决方案是使用.prop()以避免混淆。
2021-04-01 05:30:23
jQuery 的 attr() 适用于 JavaScript 属性，而不是 HTML 属性，即使名称暗示了其他情况。attr('readonly') 实际上是对 DOM Level 1 HTML 属性 readOnly 进行操作，它是一个布尔值，所以 'true' 更合适。但是，字符串 'readonly' 在自动转换为布尔值时也是一个真值，因此上述方法仍然有效。
2021-04-02 05:30:23

我认为“禁用”排除了在 POST 上发送的输入

是否允许在不使用 hidden 的情况下在 POST 上发送 html 中的只读输入值？
2021-04-07 05:30:23
是的，它确实。正是因为这个原因，我在寻找“禁用”的替代方法时发现了这个线程。
2021-04-11 05:30:23
但您可以在发送之前启用它，然后在稍后禁用它 $(document).on('submit', "#myform", function(e) { //启用输入返回 true; // 然后如果你再次禁用它需要}它的工作原理我测试过
2021-04-12 05:30:23
其它你可能感兴趣的问题
上一篇使用 JavaScript 授权 Google Drive 下一篇jQuery获取选中复选框的值到数组中