覆盖元素的灰色效果

Question

我有这行jQuery，一旦触发事件就会禁用所有按钮。

$("button").attr("disabled", "disabled");

默认情况下，禁用的按钮是灰色的，但我想知道是否有办法覆盖此行为，以便禁用按钮，但没有向用户显示？

感谢。

Answer 1

通过CSS：

一种解决方案是使用button[disabled] css选择器为禁用和启用的按钮设置相同的样式，如下所示：

button[disabled], button{
        color:#fff;
        border: none;
        background-color: grey;
    }

问题是默认情况下浏览器的按钮样式不同，因此您需要设置按钮的样式。

通过Jquery：

另一种解决方案是将click事件处理程序移除到按钮，因此请替换此行：

$("button").attr("disabled", "disabled");

这个：

$('button').off('click');

要再次启用点击事件，请使用：

$('button').on('click');

有关此商品answer上的添加/删除事件处理程序的更多信息

注意：您应该为按钮添加ID（如果您使用的是多个），因为上面的代码会删除所有按钮上的点击。