Question

我试图使用java脚本使div可见/不可见。我有一个功能，应该将可见性改为＆＃39;无＆＃39;如果div是可见的并且是可见的＆＃39;如果div不是。然而，它似乎并没有起作用。这是代码：

<script>
      function toggleTools()
      {
          var element = document.getElementById('divTools');
          if(element.style.visibility=='visible')
          {
              element.style.visibility='hidden';
          }
          else
          {
              element.style.visibility='visible';
          }
      }
</script>

Answer 1

使用

document.getElementById('divTools').style.display = 'block';
document.getElementById('divTools').style.display = 'none';

Answer 2

尝试这种方式：

<script>
      function toggleTools()
      {
          var element = document.getElementById('divTools');
          if(element.style.display!='none')
          {
              element.style.display='none';
          }
          else
          {
              element.style.display='block';
          }
      }
    </script>

但你可以使用JQuery。

$('#divTools').toggle();

Answer 3

我试过你的代码并为我工作。请查找以下代码。最初设置元素的可见性否则它在开始时不工作。

 <script>
          function toggleTools()
          {
              var element = document.getElementById('divTools');
              if(element.style.visibility=='visible')
              {
                  element.style.visibility='hidden';
              }
              else
              {
                  element.style.visibility='visible';
              }

          }
        </script>

    <div id="divTools" style="visibility:visible">
    <p>Some Text</p>
    </div>
    <input type="button" onclick="toggleTools()" value="click" />

Answer 4

最后一件事情不是它的工作，这是第一次对页面收费。我检查能见度==＆＃39;＆＃39;这很有效。

function toggleTools()
      {
          var element = document.getElementById('divTools');
          if(element.style.visibility=='visible' || element.style.visibility=='')
          {
              element.style.visibility='hidden';
          }
          else
          {
              element.style.visibility='visible';
          }
      }

现场演示：http://jsfiddle.net/Magicianred/9vTeR/1/

享受您的代码。

Answer 5

如果您最初设置了可见性，则代码可以正常运行：

通过CSS：

#divTools {
    visibility:hidden;
}

<强> jsFiddle example

或通过JavaScript：

document.getElementById('divTools').style.visibility='hidden';

<强> jsFiddle example

Javascript：切换div的可见性

5 个答案: