jQuery .attr("disabled", "disabled") 在 Chrome 中不起作用答案

【问题标题】：jQuery .attr("disabled", "disabled") not working in ChromejQuery .attr("disabled", "disabled") 在 Chrome 中不起作用
【发布时间】：2011-08-28 05:28:40
【问题描述】：

不知道为什么这不起作用。

当人们单击我的应用程序的“编辑”按钮时，禁用的文本字段变为可编辑：

$("#bewerken").click(function(e)    {
    $("input[disabled='disabled']").removeAttr('disabled');
});

然后我想在用户保存时再次禁用文本字段；我将此代码绑定到我的保存按钮：

$("#save_school_changes").click(function(e) {
    //stuff

    $.ajax({
        type: "POST",
        url: "/school/save_changes",
        data: { //stuff },
        success: function(data)
        {
            $("#feedback_top").html("<p>" + data['message'] + "</p>").slideDown('slow').delay(2000).slideUp();
            $("input[type='text']").attr('disabled', 'disabled');

        }
    });

    e.preventDefault();
});

据我所知，这应该会再次禁用文本字段。但是，这似乎不适用于 Chrome。它确实在 Firefox 中工作。我还没有机会在 IE 或 Safari 中进行测试。有什么方法可以在 Chrome 中进行这项工作吗？非常感谢！

【问题讨论】：

旁注：您可以使用:disabled 选择器代替input[disabled='disabled']。
哦，谢谢；不知道！用它更新了我的代码；）

标签： jquery google-chrome cross-browser attr jquery-attributes

【解决方案1】：

试试$("input[type='text']").attr('disabled', true);

【讨论】：

这是该技术的一个示例：jsbin.com/ofuca3/edit -- 您尝试禁用的输入是通过 ajax 写入的吗？还是它已经存在于 DOM 中？
它已经存在于 DOM 中。我会看看你的链接！谢谢

【解决方案2】：

如果您要从输入中删除所有禁用的属性，那么为什么不这样做：

$("input").removeAttr('disabled');

那么ajax成功后：

$("input[type='text']").attr('disabled', true);

确保在提交之前使用 remove disabled 属性，否则它不会提交该数据。如果需要在更改之前提交，则需要使用 readonly 代替。

【讨论】：

需要注意的是，如果您希望通过 get 或 post 提交数据，请使用 readonly。

【解决方案3】：

如果你使用 jQuery

jQuery("input[type='text']").attr("disabled", 'disabled');

如果您使用的是 jQuery 1.6+：

jQuery("input[type='text']").prop("disabled", true);

请参阅此问题：.prop() vs .attr() 了解原因。

或者你可以试试这个：

$('input:text').attr("disabled", 'disabled');

see here for info on :text

【讨论】：

使用 1.5.2；遗憾的是，我仍然无法使用您提供的代码。感谢您的宝贵时间。
$("input:text").attr("disabled", "disabled");。只需粘贴它以检查我是否有相同的代码，呵呵。无法让它工作。天哪，愚蠢的铬。 :(
@Cabaret，你能在 jsfiddle.net 上发布一个示例（工作）代码，看看你是否得到相同的结果？
是的，所以.. 我不明白。它在 JSfiddle 中运行良好，但在我的应用程序中不起作用。 jsfiddle.net/b6L6g/1
@cabaret，肯定有别的bug

【解决方案4】：

你试过prop()吗？？

好吧，prop() 似乎是works for me。

【讨论】：

注意@cabaret tho，这是 jQuery 1.6 独有的，所以如果你不在那个版本上，这将不起作用
查看我的回答和 OP 的回复

【解决方案5】：

这里：
http://jsbin.com/urize4/edit

实时预览
http://jsbin.com/urize4/

您应该使用“readonly”代替：

$("input[type='text']").attr("readonly", "true");

【讨论】：

谢谢。我会检查一下。 readonly 和 disabled 之间是否存在关键区别，还是基本相同？
它是一样的，除了一件小事...... readonly 没有任何默认的浏览器 CSS 而 disabled 有。在这个例子中，我只是做了[readonly] { filter: alpha(opacity = 50); opacity:0.5; } 并达到了同样的效果。
一大区别：设置了readonly的字段在提交表单时发送到服务器，disabled元素不发送。
啊，我不知道。谢谢。

【解决方案6】：

这是一篇旧帖子，但我的这个解决方案都不适合我，所以如果有人觉得这有帮助，我会发布我的解决方案。

我也遇到了同样的问题。

在我的例子中，我需要禁用的控件是一个带有子下拉菜单的用户控件，我可以在 IE 中禁用它，但不能在 chrome 中禁用。

我的解决方案是使用该代码禁用每个子对象，而不仅仅是用户控件：

$('#controlName').find('*').each(function () { $(this).attr("disabled", true); })

它现在在 chrome 中为我工作。

【讨论】：

【解决方案7】：

我的问题是使用禁用属性的元素需要定义为表单元素，即输入类型才能使其工作。两者都使用 attr() 和 prop() 但选择后者是为了将来的可维护性。

【讨论】：

【解决方案8】：

对我来说，这些答案都不起作用，但我终于找到了一个。

IE 需要这个-

$('input:text').attr("disabled", 'disabled');

我还必须为 Chrome 和 Firefox 添加这个 -

$('input:text').AddClass("notactive");

还有这个-

<style type="text/css">
    .notactive {
        pointer-events: none;
        cursor: default;
    }
 </style>

【讨论】：

【解决方案9】：

从 HTML-5 开始，大部分禁用的属性不适用于锚标记。因此，我们将其更改为“按钮”，并使用适当的颜色、边框样式等对其进行相应的样式设置。对于用户在 Chrome 中面临的任何类似问题，这是最恰当的解决方案。只有少数元素支持“禁用”属性：跨度、选择、选项、文本区域、输入、按钮。

【讨论】：