jQuery在文本框上设置然后只读属性

Posted 2023-03-05

【中文标题】jQuery在文本框上设置然后只读属性

【英文标题】：jQuery set then read readonly attr on textbox

【发布时间】：2011-04-12 05:23:26

【问题描述】：

​<input id="test" type="text" value="text" />​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

alert(​$(':input:not([readonly])').length);​​​​​​​​​​​​​​​​​ // 1

$('#test').attr('readonly', 'readonly');

alert($(':input:not([readonly])').length); // 1

$('#test').removeAttr('readonly');​​​​​​​​​​

alert($(':input:not([readonly])').length); // 1

除了the question here，我无法让解决方案正常工作，因为 jQuery 似乎没有正确（或至少一致地）设置 readonly 属性。

请注意，我与$('#test').attr('readonly', true); 得到相同的结果

我正在使用 Chrome，只读属性呈现为 readonly=""。这里有另一篇文章表明 FireFox 也是如此。

我对此并不在意，因为它仍然阻止文本框可编辑，但我找不到检测只读属性的方法。

我通常喜欢 jQuery，但这有点 WTF。

有什么想法吗？

【问题讨论】：

您看到这种行为的原因是因为[readonly] 选择器只检查属性的存在，而true 或false 存在.

【参考方案1】：

我个人不会使用 removeAttr()...我只是用 attr() 将其设置为 false。

然后您可以正常查询该属性：

if ($("#X").attr("readonly"))

    execute code

另外，您可以继续使用 removeAttr()，然后只使用长度作为检测属性的方法：

if (!$("#X").attr("readonly").length)

    execute code

如果您担心选择器，您应该使用 :not([readonly='readonly']) 的选择器语法 edit: 我看到您引用的答案中已经出现了。

【讨论】：

好吧，但真正导致问题的是 add 属性。

我会以同样的方式添加：$("#X").attr("readonly",true);

同样在这种情况下，通过行为而不是浏览器调试器...有时它们并不总是正确跟踪这样的属性更改。

【参考方案2】：

我认为即使您设法使用 javascript 以编程方式禁用输入，智能用户也可以在禁用浏览器 JavaScript 时更改它。因此，为了安全起见，最好在服务器端重新加载该值。