MomMom
90
2021-03-29 15:20:09 작성 2021-03-29 15:22:04 수정됨
4
142

자바스크립트 질문드립니다.



         <div class="ui segment button" style="width: 100%;"
            id="bt">
              <p>첫번째 버튼</p>
            </div>
  
         
            <div class="ui segment button" style="width: 100%;"
            id="bt2">
              <p>두번째 버튼</p>
            </div>


<div id="my_div1">
      첫번째버튼 누르면 그 내용은 여기에출력
    </div>

<div id="my_div2">
      두번째버튼 누르면 그 내용은 여기에출력
    </div>


document.getElementById('bt').onclick =
function show() {
var x = document.getElementById("my_div1");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
document.getElementById('bt2').onclick =
function show() {
var x = document.getElementById("my_div2");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}


안녕하세요. 다름이아니라


특정 div 에서 버튼만누르면 그 내용만바뀌는식으로 만들고싶습니다.


어찌저찌 하기는했는데. 문제가 첫번째 버튼을누르면 그 내용이 나오잖아요?...


그럼 두번째버튼을 누르면 첫번째 내용은 사라지고 두번째버튼의 내용이 나오게하고싶은데


지금 상태에서는 첫번째버튼누르면 첫번째내용나온거 아래로 두번째버튼의 내용이 정렬됩니다..


이걸 어떻게 해야할까요..ㅜㅜ

0
  • 답변 4

  • howoni123
    1k
    2021-03-29 16:29:13

    첫번째 버튼 눌러서 화면을 보여줄때 div2의 display를 none으로 바꾸세요

    두번쨰 버튼 눌러서 화면을 보여줄때 div1의 display를 none으로 바꾸세요

    ... 답을 질문에 써두셨는데요....

    질문하셨으니 답변은 드리는데...  조금은 더 고민하고 질문글올려도 되지 않았을까 싶습니다 :(

    document.getElementById('bt').onclick =
    	function show() {
    		var x = document.getElementById("my_div1");
    		var y = document.getElementById("my_div2");
    		if (x.style.display === "none") {
    			x.style.display = "block";
    			y.style.display = "none"
    		} else {
    			x.style.display = "none";
    		}
    	}


  • 퀘이사123
    618
    2021-03-29 17:05:10

    bt 누르면 my_div1 block으로 만들고 my_div2 none으로 하고

    bt2 누르면  my_div1 none으로 만들고 my_div2 block으로 하고

  • MomMom
    90
    2021-03-29 17:07:55

    퀘이사123 헉... 감사합니다. 듣고나니 머리가 띵하네요;.. 위에서 이미 말해주셨는데 ㅠㅠ

  • MomMom
    90
    2021-03-29 17:11:10

     

    howoni123 감사합니다..ㅜㅜ 생각 조금만 했으면되는데 거기까지 못갔네요.
  • 로그인을 하시면 답변을 등록할 수 있습니다.