Jquery 使用 attr() 禁用输入
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3342031/
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
Jquery disable input with attr()
提问by Chris-NTA
I have a wired behaviour when I try to disable or readonly a input field using the attr().
当我尝试使用 attr() 禁用或只读输入字段时，我有一个有线行为。
removeAttr('disabled')is working ok.
removeAttr('disabled')工作正常。
attr('name', 'somthing')is working
attr('name', 'somthing')正在工作
attr('id', 'something else')is working
attr('id', 'something else')正在工作
attr('disabled','disabled')not working -> it writes only disabled="" in the DOM and it does not disable the input field
attr('disabled','disabled')不工作 -> 它只在 DOM 中写入 disabled="" 并且它不会禁用输入字段
attr('readonly','readonly')not working -> it writes only readonly="" in the DOM but the input field can still be edited.
attr('readonly','readonly')不工作 -> 它只在 DOM 中写入 readonly="" 但输入字段仍然可以编辑。
$(document).ready(function() {
$("input[name='rdio']").live('click', function() {
$(".radio_select").find("input[name='rdio']").each(function(){
if(this.checked)
{
$("#"+this.value).removeAttr('disabled');
}
else
{
$("#"+this.value).attr('disabled','disabled');
}
});
});
});
Has anyone experienced this behaviour? BTW I'm using jquery 1.4.2
有没有人经历过这种行为？顺便说一句，我正在使用 jquery 1.4.2
EDIT: Sorry, this was something I have tried and forgot to put it back. So with attr() the problem persists.
编辑：对不起，这是我尝试过但忘记放回去的东西。所以使用 attr() 问题仍然存在。
回答by jAndy
It would be pretty interesting in which browser you experience that behavior. Even more interesting would be to know, if not workingmeans, the element does not get disabled, or the attribute is just missing the disabledas value.
您在哪个浏览器中遇到这种行为会非常有趣。更有趣的是要知道，如果不工作意味着，元素不会被禁用，或者属性只是缺少disabledas 值。
Due to W3Cthere should not be a value for disabledor readonly.
由于或W3C不应该有值。disabledreadonly
So syntatically
所以在语法上
<select disabled></select>
is just fine and correct. No value needed.
很好而且正确。不需要值。
Unfortunatly, there is no way to create such a construct with javascript (if you don't want to overwrite the html), so you are forced to add some value. Since both propertys are boolean, you can add pretty much anything. .attr('disabled', 'foobar')is just as good as .attr('disabled', true).
不幸的是，没有办法用 javascript 创建这样的构造（如果你不想覆盖 html），所以你不得不添加一些值。由于这两个属性都是布尔值，因此您几乎可以添加任何内容。.attr('disabled', 'foobar')一样好.attr('disabled', true)。
回答by Sadat
Try using-
尝试使用-
$('#target').attr("disabled", true);
$('#target').attr("readonly", true);
回答by Ahmed Magdy
I think it should be like this
我觉得应该是这样
attr('disabled', true);
and the same for readonly
和只读相同
回答by larrydahooster
.attr('disabled', 'disabled');does a good job.
.attr('disabled', 'disabled');做得很好。
The W3C specification says you have to set the attribute without a value. But thats a jquery attr() function problem. You can't set an attribute without a value.
W3C 规范说你必须设置没有值的属性。但那是一个 jquery attr() 函数问题。您不能设置没有值的属性。
It writes disabled=""in the DOM. But it is working pretty fine.
它写disabled=""在 DOM 中。但它工作得很好。
See here: http://www.w3schools.com/tags/att_input_disabled.asp
回答by Paul Dragoonis
Doing .attr('disabled', true/false);and the same with readonlyis the quickest approach. However, do remember that if an element is "disabled" it will not appear in the forms submit data, whereas readonlywill appear in the post data. This is a common pitfall for developers to want to disable input but then wonder why they don't get their $_POSTdata in PHP.
做.attr('disabled', true/false);和一样readonly是最快的方法。但是，请记住，如果一个元素被“禁用”，它将不会出现在表单提交数据中，而readonly会出现在发布数据中。对于想要禁用输入但又想知道为什么他们不在$_POSTPHP 中获取数据的开发人员来说，这是一个常见的陷阱。
Just a little heads up !
只是有点抬头！
回答by Dan Chadwick
@OP: I suspect the button is functionally disabled but visually not disabled.
@OP：我怀疑按钮在功能上被禁用，但在视觉上没有被禁用。
I experienced exactly the same symptoms. Using attr('disabled', 'disabled') yielded disabled="" in the DOM. The button was in fact disabled in that it no longer generated a click event nor submitted the form. However it was still being highlighted as if it were.
我经历了完全相同的症状。使用 attr('disabled', 'disabled') 在 DOM 中产生了 disabled="" 。该按钮实际上已被禁用，因为它不再生成单击事件，也不再提交表单。然而，它仍然被突出显示，好像它是。
The cause was the CSS for the button, which contained the pseudo-selector ':active'. This is being applied even though the button is disabled. Adding ':not([DISABLED])' to active removed the misleading highlighting.
原因是按钮的 CSS，其中包含伪选择器 ':active'。即使按钮被禁用，这也会被应用。添加 ':not([DISABLED])' 到 active 消除了误导性的突出显示。
To any Drupal users, the Seven theme has this CSS and Seven is the default administrative theme.
对于任何 Drupal 用户来说，Seven 主题都有这个 CSS，而 Seven 是默认的管理主题。
I verified this in FF and Chrome.
我在 FF 和 Chrome 中验证了这一点。
