CSS按鈕：懸停，禁用然後重新啓用JavaScript

我有一些按鈕，其懸浮效果，使懸停按鈕顏色更深（與CSS）。CSS按鈕：懸停，禁用然後重新啓用JavaScript

當用戶點擊這些按鈕時，我通過JavaScript禁用它們。

當我想要程序（遊戲）再次啓動，我通過javascript，CSS按鈕重新啓用按鈕：懸停效果不再工作。

任何解決方案？

的JavaScript啓用/禁用按鈕的功能是：

function jsEnableElement(id) { 

if (document.getElementById(id)) { 
    document.getElementById(id).style.background = "#3399FF"; 
    document.getElementById(id).style.cursor = "pointer"; 
    document.getElementById(id).disabled = false; 
} 

} 

function jsDisableElement(id) { 

if (document.getElementById(id)) { 
    document.getElementById(id).style.background = "#DDDDDD"; 
    document.getElementById(id).style.cursor = "default"; 
    document.getElementById(id).disabled = true; 
} 

}

來源

2011-12-08 user1087448

你能告訴是你按鍵，請... TA – ManseUK

<按鈕ID =「btnL1」類型=「提交」的onclick的HTML = 「jsHangmanCheckLetter（ID， 'A'）;」><跨度ID = 「SPAN1」>一個 – user1087448

和功能jsHangmanCheckLetter（SID，sLetter）{ \t嘗試{\t \t \t 如果\t（g_GameIsActive == = true）{ \t \t \t jsDisableElement（sID）; \t \t} \t} \t趕上（ERR）{ \t \t警報（「ERROR :: sHangmanCheckLetter（sLetter）::」 + ERR）; \t} } – user1087448

我不知道爲什麼行爲休息時改變元素的背景顏色雖然你們保持其ID或類名。但顯然它確實如此。

因此，另一種方法來解決這個問題，也許更好的方法是更改元素的類。

我不知道你想禁用什麼元素，但我使用DIV作爲例子。一個工作演示可以在這裏找到：

http://jsfiddle.net/yVVk6/

但只是completness我會在這裏藏漢

<html> 
<head> 
    <script> 
     function jsEnableElement(id) { 
      if (document.getElementById(id)) { 
       document.getElementById(id).removeAttribute("disabled"); 
       document.getElementById(id).className = "enabled"; 
       //document.getElementById(id).disabled = false; 
      } 
     } 

     function jsDisableElement(id) { 
      if (document.getElementById(id)) { 
       document.getElementById(id).removeAttribute("enabled"); 
       document.getElementById(id).className = "disabled"; 
       //document.getElementById(id).disabled = true; 
      } 
     } 
    </script> 
</head> 
<body> 
    <div id="hallo" class="enabled" onclick="jsDisableElement('hallo');">Click me to disable</div> 
    <div onclick="jsEnableElement('hallo');">Click me to enable it again</div> 
</body>

CSS添加代碼：

.enabled { 
    background: #3399FF; 
} 
.enabled:hover { 
    background: #00FF66; 
} 

.disabled { 
    background: #DDD; 
}

編輯：只是另一件事，我想米如果你使用這個解決方案，那麼我真的建議你使用像jQuery這樣的庫。它允許您輕鬆編輯，刪除或添加類到元素。在這個例子中，我簡單地刪除元素中的所有類。

來源

2011-12-08 10:21:55 w00

我會試試這個，謝謝！ – user1087448

這是純JavaScript操作類的方法....非常簡單.... http://stackoverflow.com/questions/195951/change-an-elements-css-class-with-javascript – ManseUK

作爲一種魅力，謝謝！ – user1087448

我想你可以直接給該屬性，如下圖所示：

document.getElementById("btnL1").setAttribute("disabled","true") //to disable the button 
document.getElementById("btnL1").removeAttribute("disabled")  //enable it again

來源

2011-12-08 10:29:21

我認爲你誤解了這個問題 - 啓用/禁用工作 - 問題是，再次啓用後，css：hover屬性不起作用 – ManseUK

CSS按鈕：懸停，禁用然後重新啓用JavaScript

回答

相關問題