0

私のページには、次のテーマ変更ボタンがあります。

<button class="small theme" name="darkBlue" onclick="setThemeColor(this)">
   <span style="color: white; font-weight: bold;">#</span>
</button>
<button class="small theme" name="black" onclick="setThemeColor(this)">
   <span style="color:black; font-weight:bold;">#</span>
</button>

私はこのJavaScriptを持っています:

   <script type="text/javascript">
      if (localStorage.themeColor) {
         document.getElementsByTagName('html')[0].className = localStorage.themeColor;
      }

      function setThemeColor(button) {
         localStorage.themeColor = button.name;
         document.getElementsByTagName('html')[0].className = button.name;
         var themeButtons = document.querySelectorAll(".theme");
         for (var themeButton in themeButtons) {
             themeButtons[themeButton].disabled = false;
         }
        button.disabled = true;
      }
   </script>

これは常に2つのボタンを表示しますが、現在のボタンを無効にする代わりに、ボタンが表示されないようにしたいと思います。誰かがこれを行う方法を提案できますか?

4

1 に答える 1

0
function setThemeColor(button) {
    localStorage.themeColor = button.name;
    document.getElementsByTagName('html')[0].className = button.name;
    var themeButtons = document.querySelectorAll(".theme");
    for (var themeButton in themeButtons) {
        themeButtons[themeButton].disabled = false; // Re-included from original code
        themeButtons[themeButton].style.visibility="visible" // Corrected from original answer
    }
    button.disabled = true;
    button.style.visibility="hidden" // Added/Moved from above after noted I'd messed up the logic
}
于 2013-10-21T15:14:47.053 に答える