jquery div show hide 예제

■ div id를 parameter로 받아 display 속성을 block, none으로 변경하는 함수

var attr;
function showHide( divId ) {
    attr = $("#"+divId).css("display");
    console.log( divId + " display attribute is : " + attr );
    if( attr=="block" ) {
        $("#"+divId).css("display","none");
    }
    else {
        $("#"+divId).css("display","block");
    }
}

■ show / hide 속성 변경 대상 div

<a href="javascript:showHide('sampleDiv1')">SampleDIV1</a>
<a href="javascript:showHide('sampleDiv2')">SampleDIV2</a>
<a href="javascript:showHide('sampleDiv3')">SampleDIV3</a>
<br/>
<div id="sampleDiv1" style="display:block;">SampleDIV 1</div>
<div id="sampleDiv2" style="display:block;">SampleDIV 2</div>
<div id="sampleDiv3" style="display:block;">SampleDIV 3</div>

• jQuery checkbox 전체 선택/해제 예제 2022년 3월 15일
• Highcharts error #17 2019년 7월 10일
• Highchart TypeError: c.init is not a function 2019년 7월 10일
• Highchart 크기 조정 2019년 7월 8일
• Highcharts error #13 2019년 7월 8일
• Grid Stack Two grids demo 예제 2019년 6월 12일
• 동적으로 추가/생성된 태그에 이벤트 추가 방법 2019년 6월 10일
• Highcharts update event 2019년 3월 26일
• jdom2를 이용한 spring xml response(응답) 2017년 12월 5일
• jquery xml 요청, spring xml 리턴 2017년 12월 5일
• jquery div show hide 예제 2016년 5월 25일
• jquery css 예제 2016년 5월 25일
• jquery selectbox 예제 2016년 5월 25일
• jquery json 예제 2016년 5월 25일
• jquery template 예제 1 2016년 5월 25일
• jquery datepicker 2016년 5월 9일
• jquery radiobox 2016년 4월 29일
• jquery bgiframe 정리 2016년 2월 1일
• jquery each( $.each ) 2016년 1월 25일
• jquery spring – checkbox로 선택된 배열 주고 받기 2015년 8월 15일
• jquery spring ajax call 2015년 8월 15일
• jQuery 동적 체크박스 제어 2015년 1월 27일
• 간단한 jquery chained selectbox 예제 2014년 12월 4일
• jquery ui tip 2014년 9월 2일