javascript如果让页面上的按钮变灰（按钮可见但不可用）

Question

javascript如果让页面上的按钮变灰（按钮可见但不可用）disabled=true后按钮变灰了但点击后还可以变亮求解。

Answer 1

使用语句：document.getElementById("按钮").setAttribute("disabled", true)即可。

1、设置一个html页面，页面上有一个按钮，初始是可使用的。

2、设计一个函数，作为按钮绑定测试：

3、此时点击页面上的按钮数次：

4、打开开发者console，如下：

5、此时给button添加关键代码：

6、再次测试，刷新页面查看，变成了灰色：

7、点击按钮数次，打开console，显示无输出：

Answer 2

<input id=xxx type=button value="点我不会变亮">
<script>
document.getElementById("xxx").disabled=true;
</script>

如果你的按钮点击后会变亮，那你的代码肯定有问题的，要看到你的代码才知道原因。

Answer 3

setAttribute("disabled", "disabled");

Answer 4

按钮disabled之后无法获取点击事件，不过在大部分浏览器里其上层的HTML元素还是可以得到事件的。这样就可以在上一层的HTML标签里加入点击事件。不过firefox 火狐浏览器对disabled的按钮完全不触发任何事件。
通用的办法：在按钮上覆盖一个透明的HTML元素,并处理点击事件

<div style="display:inline-block;position:relative;">
<input type="button" value=button1 disabled="disabled"/><div id=touMingDiv style="position:absolute;left:0;right:0;top:0;bottom:0;"></div></div>

JavaScript:
document.getElementById('touMingDiv').onclick = function(){
this.style.display = "none";
this.previousSibling.disabled = false;
}

来源（http://stackoverflow.com/questions/3100319/event-on-a-disabled-input）

Answer 5

首先你得有2张图片，一张是 灰色的，一张是高亮的 图片，。当图片为 true 也就是 灰色显示的时候，是不可用状态，再次点击他，该灰色图片隐藏显示 高亮图片冰正常使用。我是这么用的