JavaScript/jQuery

버튼 클릭시 특정영역 숨기기 보이기

유혁스쿨 2020. 10. 5. 00:36
728x90
반응형

html onclick속성 자바스크립트

<div class="col-md-5" id="noneDiv" style="display: none;"></div>
<button onclick="onDisplay()">숨은 DIV보이기</button>
<button onclick="offDisplay()">DIV 숨기기</button>
<scrpit>
function onDisplay() {
    $('#noneDiv').show();
}
function offDisplay() {
    $('#noneDiv').hide();
}
</scrpit>

 

JQuery 클릭이벤트

<div class="col-md-5" id="noneDiv" style="display: none;"></div>
<button id="onDisplay">숨은 DIV보이기</button>
<button id="offDisplay">DIV 숨기기</button>
<script>
$(function(){
    $('#onDisplay').click(function(){
	    if($("#noneDiv").css("display") == "none"){
            $('#noneDiv').show();
    	}
    });
});
</script>
<script>
$(function(){
    $('#offDisplay').click(function(){
	    if($("#noneDiv").css("display") != "none"){
            $('#noneDiv').hide();
    	}
    });
});
</script>
728x90
반응형