gpt4 book ai didi

javascript - 禁用不适用于我的按钮

转载 作者:太空宇宙 更新时间:2023-11-04 13:46:40 27 4
gpt4 key购买 nike

我一直在尝试制作自己的按钮,但出于某种原因,我似乎无法使 :disable 正常工作。我希望按钮被禁用(不响应点击和灰色文本)。我错过了什么?

http://jsfiddle.net/aj4n0ymd/

HTML:

<!doctype html>
<div id="menu">
<a class="button" disabled="true" id="button">Click</a>
</div>

CSS:

.button {
display: block;
width: 40%;
text-align: center;
float: left;
color: #000000;
font-size: 10px;
padding: 0.5em 1em;
text-decoration: none;
-webkit-user-select: none; /* Chrome/Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */
/* Rules below not implemented in browsers yet */
-o-user-select: none;
user-select: none;
}
.button:hover {
background: #f0f0f0;
text-decoration: none;
}
.button:active {
background: rgb(150, 150, 150);
background-image: linear-gradient(to bottom, rgb(150, 150, 150), rgb(200, 200, 200));
text-decoration: none;
}
.button:disabled {
color:rgb(150, 150, 150);
}

此外,这将与 javascript 一起使用。这足以在 js 中更改禁用状态吗?

button = document.querySelector("#button");
button.disabled = true;

最佳答案

a标签没有禁用属性。查看文档以了解可以具有的有效属性。只有inputsselecttextareas可以有 disabled 属性。

您可以删除 href或添加返回 false 的点击处理程序。

$("#button").on("click", function() {
alert("ok");
});
.button {
display: block;
width: 40%;
text-align: center;
float: left;
color: #000000;
font-size: 10px;
padding: 0.5em 1em;
text-decoration: none;
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
/* Rules below not implemented in browsers yet */
-o-user-select: none;
user-select: none;
background: transparent;
border: none;
}
.button:hover {
background: #f0f0f0;
text-decoration: none;
}
.button:active {
background: rgb(150, 150, 150);
background-image: linear-gradient(to bottom, rgb(150, 150, 150), rgb(200, 200, 200));
text-decoration: none;
}
.button:disabled {
color: rgb(150, 150, 150);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="menu" disabled="disabled">
<input type="button" class="button" id="button" disabled="disabled" value="Click" />
</div>

引用资料

MDN <a> element

关于javascript - 禁用不适用于我的按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26784125/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com