[英]How can I disable a button when you hover over it?
我需要知道當我在 hover 上禁用按鈕時如何禁用它，然后在我不在時啟用它。
我嘗試過 javascript，在鼠標坐標剛好如此時禁用它，但它不起作用。
到目前為止，這是我的代碼：
HTML：
<.DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>This is a button</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <button type="button">Press Me</button> <script src="script.js"></script> </body> </html>
這是一個玩笑，但我希望它快點完成。
謝謝，啟發我
PS：我是 StackOverflow 的新手，所以請指點帖子等。
#joke-btn:hover{ display:none }
<.DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>This is a button</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <button id="joke-btn"type="button">Press Me</button> <script src="script.js"></script> </body> </html>
用這個
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>This is a button</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<button type="button" id="hbtn">Press Me</button>
</body>
<script>
document.getElementById('hbtn').addEventListener('mouseenter',(event)=>{
event.target.disabled=true;
});
</script>
</html>
希望這可以幫助
使用 JavaScript，您可以為onmouseenter和onmouseleave DOM 事件添加事件偵聽器，並更改button HTML 元素的disabled屬性值。
例如，在您的情況下，一個簡單的代碼解決方案（不是唯一可能的）將類似於：
const button = document.querySelector("button");
button.addEventListener("mouseenter", () => {
button.disabled = true;
});
button.addEventListener("mouseleave", () => {
button.disabled = false;
});
我認為這里最簡單的選擇是使用 css 來完成。 但是，這實際上並沒有禁用按鈕，只是鼠標單擊事件，因此您仍然可以在使用返回鍵選擇按鈕時單擊該按鈕：
將 class 分配給您的按鈕（您可以隨意調用它）：
<button class="myButton" type="button">Press Me</button>
在您的 CSS 文件中禁用鼠標點擊：
.myButton:hover {
pointer-events: none;
}
將鼠標懸停在另一個div的按鈕上時，如何更改div的背景？
[英]how do i change a div background when you hover over a button in another div?
當我將鼠標懸停在圖像內的文本上時，如何禁用懸停事件？
[英]How to disable the hover event when I hover over the text inside the image?
當您在浮動操作按鈕上使用 hover 時，您如何添加選項它會像過濾器一樣改變顏色
[英]how do you add a option were when you hover over a floating action button it changes the color like a filter
當我將鼠標懸停在按鈕邊緣時，如何使所有條形變為黑色？
[英]How do i get all of my bars to turn black when I hover over the edge of the button?
在 Woocommerce 評論中將鼠標懸停在星星上時如何更改星星的顏色？
[英]How to change the color of stars when you hover over it in Woocommerce reviews?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.