2026, 새로운 도약을 시작합니다.

제이쿼리 닫기버튼 추가? 채택완료

안녕하세요 질문좀드리겠습니다.

아래 제이쿼리를 이용중인데요 

따로 닫기 버튼이 없더라구요 ㅠㅠ 

추가 하고싶은데 어떻게 해야하나요 

Copy












$(document).ready(function(){

    $("#spreadBtn").click(function(){

        if($("#hiddenContent").is(":visible")){

            $("#hiddenContent").css("display", "none");

        }else{

            $("#hiddenContent").css("display", "block");

        }

    });

});





 



펼치기

내용





답변 2개

채택된 답변
+20 포인트

같은 아이디를 갖는게 두개이니 작동을 안하는 겁니다.

아래 두가지 방식 있으니 해보세요.

버튼 아이디 잘 보시고요.

<HTML>
<HEAD>
<!-- jQuery를 사용하려면 아래 코드 한 줄을 반드시 추가해야한다. -->
<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
</HEAD>
 
<BODY>
    <script>
        $(document).ready(function(){
            $("#spreadBtn").click(function(){
                if($("#hiddenContent").is(":visible")){
                    $("#hiddenContent").css("display", "none");
                    $("#spreadBtn").text("펼치기");
                }else{
                    $("#hiddenContent").css("display", "block");
                    $("#spreadBtn").text("닫기");
                }
            });
        });
    </script>
    <button id="spreadBtn" class="btn01">상태에 따라 이름이 변하는 버튼</button>
    <div id="hiddenContent" class="example01" style="display: none;">내용</div>

    <hr>

    <script>
        $(document).ready(function(){
            $("#spreadBtn_1").click(function(){
                    $("#hiddenContent_2").css("display", "block");
            });
        });

        $(document).ready(function(){
            $("#spreadBtn_2").click(function(){
                    $("#hiddenContent_2").css("display", "none");
            });
        });
    </script>
    <button id="spreadBtn_1" class="btn01">펼치기</button>
    <button id="spreadBtn_2" class="btn01">닫기</button>
    <div id="hiddenContent_2" class="example01" style="display: none;">내용</div>

</BODY>
</HTML>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

와 너무감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

코드 자체가 둘다 겸용인데요.

보일때 누르면 닫히고

안보일때 누르면 열리고

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

그런데 이게 버튼이 2개 일시에는 아무것도 작동을 안하더라구요

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고