Jquery 使用 attr() 禁用输入

发布于 2024-09-11 12:47:57 字数 924 浏览 1 评论 0原文

当我尝试使用 attr() 禁用或只读输入字段时,我出现了有线行为。

removeAttr('disabled') 工作正常。

attr('name', 'somthing') 正在工作

attr('id', 'something else') 正在工作

attr('disabled','disabled ') 不工作 ->它只在 DOM 中写入 disabled="" 并且不会禁用输入字段

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');
            }
        });
    });
});

有人经历过这种行为吗?顺便说一句,我正在使用 jquery 1.4.2

编辑:抱歉,这是我尝试过但忘记把它放回去的东西。所以使用 attr() 问题仍然存在。

I have a wired behaviour when I try to disable or readonly a input field using the attr().

removeAttr('disabled') is working ok.

attr('name', 'somthing') is working

attr('id', 'something else') is working

attr('disabled','disabled') not working -> it writes only disabled="" in the DOM and it does not disable the input field

attr('readonly','readonly') not working -> it writes only readonly="" in the DOM but the input field can still be edited.

$(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

EDIT: Sorry, this was something I have tried and forgot to put it back. So with attr() the problem persists.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(6

无畏 2024-09-18 12:47:57

在哪种浏览器中体验这种行为会非常有趣。更有趣的是要知道,如果不工作意味着该元素没有被禁用,或者该属性只是缺少disabled作为值。

由于 W3C 的原因,不应有 disabledreadonly 值。

所以从语法上来说

<select disabled></select>

是很好而且正确的。不需要任何值。

不幸的是,无法使用 javascript 创建这样的构造(如果您不想覆盖 html),因此您被迫添加一些值。由于这两个属性都是布尔值,因此您可以添加几乎任何内容。 .attr('disabled', 'foobar').attr('disabled', true) 一样好。

It would be pretty interesting in which browser you experience that behavior. Even more interesting would be to know, if not working means, the element does not get disabled, or the attribute is just missing the disabled as value.

Due to W3C there should not be a value for disabled or readonly.

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).

沒落の蓅哖 2024-09-18 12:47:57

尝试使用-

$('#target').attr("disabled", true);
$('#target').attr("readonly", true);

Try using-

$('#target').attr("disabled", true);
$('#target').attr("readonly", true);
送你一个梦 2024-09-18 12:47:57

我认为它应该是这样的,

attr('disabled', true);

对于只读来说也是一样的

I think it should be like this

attr('disabled', true);

and the same for readonly

↘人皮目录ツ 2024-09-18 12:47:57

.attr('disabled', 'disabled'); 做得很好。

W3C 规范规定您必须设置不带值的属性。但这是 jquery attr() 函数的问题。您无法设置没有值的属性。

它在 DOM 中写入 disabled=""。但它工作得很好。

请参阅此处:http://www.w3schools.com/tags/att_input_disabled.asp

.attr('disabled', 'disabled'); does a good job.

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.

It writes disabled="" in the DOM. But it is working pretty fine.

See here: http://www.w3schools.com/tags/att_input_disabled.asp

七婞 2024-09-18 12:47:57

执行 .attr('disabled', true/false); 以及使用 readonly 是最快的方法。但是,请记住,如果某个元素被“禁用”,它将不会出现在表单提交数据中,而 readonly 将出现在发布数据中。对于开发人员来说,这是一个常见的陷阱,他们想要禁用输入,但又想知道为什么他们没有在 PHP 中获取 $_POST 数据。

只是稍微抬起头!

Doing .attr('disabled', true/false); and the same with readonly is the quickest approach. However, do remember that if an element is "disabled" it will not appear in the forms submit data, whereas readonly will 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 $_POST data in PHP.

Just a little heads up !

凉城 2024-09-18 12:47:57

@OP:我怀疑该按钮在功能上已禁用,但在视觉上并未禁用。

我经历了完全相同的症状。在 DOM 中使用 attr('disabled', 'disabled') 会产生disabled=""。该按钮实际上已被禁用,因为它不再生成单击事件,也不再提交表单。然而,它仍然被突出显示,就好像它是一样的。

原因是按钮的 CSS,其中包含伪选择器“:active”。即使该按钮被禁用,也会应用此功能。将 ':not([DISABLED])' 添加到 active 中删除了误导性的突出显示。

对于任何 Drupal 用户来说,“七”主题具有此 CSS,并且“七”是默认的管理主题。

我在FF和Chrome中验证了这一点。

@OP: I suspect the button is functionally disabled but visually not disabled.

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.

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.

To any Drupal users, the Seven theme has this CSS and Seven is the default administrative theme.

I verified this in FF and Chrome.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文