그누보드 QA - 테이블 접기 펴기 문의 드립니당~~ ^^(자바스크립트)

테이블 접기 펴기 문의 드립니당~~ ^^(자바스크립트)

다둥이아빠 홈페이지 자기소개 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

홈페이지 자기소개 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2022.05.30 15:51:49 1734 (218.♡.♡.63)

답변 5

본문

아래 스크립트를 이용해서 접기펴기를 이용하려고 하는데유..

여러개 사용하려고

여러개를 사용하려면..~ ID 만 바꾸면 되나유?

너무 어렵네요.



<!-- 접기 펴기 자바스크립트-->
<script type="text/javascript">
var elements = document.getElementsByTagName("div");

// 모든 영역 접기
for (var i = 0; i < elements.length; i++) {
  if (elements[i].className == "elements") {
    elements[i].style.display="none";
  } else if (elements[i].className == "label") {
    elements[i].onclick=switchDisplay;
  }
}

// 상태에 따라 접거나 펼치기
function switchDisplay() {

  var parent = this.parentNode;
  var target = parent.getElementsByTagName("div")[1];

  if (target.style.display == "none") {
    target.style.display="block";
  } else {
    target.style.display="none";
  }
  return false;
}
</script>
</body>

<form>
  <div>
    <div id="section1" class="label" >
      <p><button type="button" class="btn btn-primary" style="width:100%">차량예약하기</button></p>
    </div>
    <div id="section1b" class="elements">

<!-- 내용-->
</div>
</div>
<div>