HTML DOM 按钮的 disabled 属性
htmlweb developmentfront end technology更新于 2025/9/22 22:36:17
HTML DOM 按钮的 disabled 属性与 <button> 元素的 disabled 属性相关联。按钮的 disabled 属性用于设置或返回给定按钮是否被禁用。它用于禁用按钮,以便用户无法再与指定元素交互。在 Web 浏览器中,设置 disabled 属性将默认使按钮变灰。
语法
以下是语法 −
设置 disabled 属性 −
buttonObject.disabled = true|false
此处,true|false 指定给定的输入按钮是否应被禁用。
- True −按钮被禁用。
- False −按钮不会被禁用。
让我们看一个按钮 disabled 属性的示例 −
示例
<!DOCTYPE html>
<html>
<body>
<button id="Button1">BUTTON</button>
<p>Click the below button to disable the above button.</p>
<button onclick="buttonDis()">CLICK IT</button>
<p id="Sample">
<script>
function buttonDis() {
document.getElementById("Button1").disabled = true;
var x=document.getElementById("Button1").disabled;
document.getElementById("Sample").innerHTML = "Button disabled is "+x;
}
</script>
</body>
</html>
输出
这将产生以下输出 −

点击"CLICK IT"按钮时 −

在上面的例子中 −
我们创建了一个 id 为 “Button1” 的按钮,该按钮默认处于启用状态。
<button id="Button1>BUTTON</button>
然后,我们创建了"CLICK IT"按钮,以便在点击时执行 buttonDis() 方法。
<button onclick="buttonDis()">CLICK IT</button>
buttonDis() 方法通过 id "button1"获取按钮元素,并将其 disabled 属性设置为 true。禁用按钮后,其 disabled 值(true 或 false)将赋给变量 x,并显示在 id 为"Sample"的段落中。
function buttonDis() {
document.getElementById("Button1").disabled = true;
var x=document.getElementById("Button1").disabled;
document.getElementById("Sample").innerHTML = "Button disabled is "+x;
}
相关文章
有用资源
html 参考教程 - 该教程包含有关 html 的更多信息:https://www.cainiaomax.com/html/

