Show&Hide toggle

| 토글 버튼 오류

 

html table의 row를 숨겨주고 보여주는 토글버튼을 사용하기 위해 다음의 코드를 사용하였다.

<div id="test">
This is my DIV element.
</div>

<button onclick="showToggle()">Try it</button>

<script>
function showToggle() {
  var x = document.getElementById("test");
  if (x.style.display === "none") {
    x.style.display="block";
  } else {
    x.style.display = "none";
  }
}
</script>

허나 display="block"; 시 colspan을 인식하지 않는 오류가 발생하였다.

 

| 해결 

x.style.display=""; 로 blank 값을 주면 인식이된다.

<div id="test">
This is my DIV element.
</div>

<button onclick="showToggle()">Try it</button>

<script>
function showToggle() {
  var x = document.getElementById("test");
  if (x.style.display === "none") {
    x.style.display="";
  } else {
    x.style.display = "none";
  }
}
</script>