<button id="button1">按鈕1</button>
<button id="button2">按鈕2</button>
<button id="button3">按鈕3</button>
window.onload = function () {
// 點按鈕1將按鈕2與3停用
document.getElementById("button1").onclick = function () {
document.getElementById("button2").setAttribute("disabled", "disabled");
document.getElementById("button3").setAttribute("disabled", "disabled");
};
// 點按鈕2將按鈕1與3停用
document.getElementById("button2").onclick = function () {
document.getElementById("button1").setAttribute("disabled", "disabled");
document.getElementById("button3").setAttribute("disabled", "disabled");
};
// 點按鈕3將按鈕1與2停用
document.getElementById("button3").onclick = function () {
document.getElementById("button1").setAttribute("disabled", "disabled");
document.getElementById("button2").setAttribute("disabled", "disabled");
};
// 同場加映:3 秒後恢復原狀
document.getElementById("button1").addEventListener("click", function () {
setTimeout(
"document.getElementById('button2').removeAttribute('disabled');document.getElementById('button3').removeAttribute('disabled');",
3000)
});
document.getElementById("button2").addEventListener("click", function () {
setTimeout(
"document.getElementById('button1').removeAttribute('disabled');document.getElementById('button3').removeAttribute('disabled');",
3000)
});
document.getElementById("button3").addEventListener("click", function () {
setTimeout(
"document.getElementById('button1').removeAttribute('disabled');document.getElementById('button2').removeAttribute('disabled');",
3000)
});
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.