Contents

조회 수 713 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

Observing show/hide events with jQuery.


HTML Code

<button id="btnShow">Show</button> <button id="btnHide">Hide</button> <div class="container"> <div id="foo"> I am #foo </div> </div> <div id="console"> </div>

CSS Code

.container { height:60px; margin:10px; } #foo { background-color:#eeeeee; width:150px; height:50px; text-align:center; font-size:20px; }

JQuery Code

//The magic code to add show/hide custom event triggers (function ($) { $.each(['show', 'hide'], function (i, ev) { var el = $.fn[ev]; $.fn[ev] = function () { this.trigger(ev); return el.apply(this, arguments); }; }); })(jQuery); //on Show button click; show the #foo div $('#btnShow').click(function(){ $('#foo').show(); }); //on Hide button click; hide the #foo div $('#btnHide').click(function(){ $('#foo').hide(); }); //Add custom handler on show event and print message $('#foo').on('show', function(){ $('#console').html( $('#console').html() + '#foo is now visible'+ '<br>' ) }); //Add custom handler on hide event and print message $('#foo').on('hide', function(){ $('#console').html( $('#console').html() + '#foo is hidden'+ '<br>' ) });


[출처] https://www.viralpatel.net/jquery-trigger-custom-event-show-hide-element/




?

List of Articles
번호 분류 제목 글쓴이 날짜 조회 수
1169 Develop [ios] 아이폰용 앱 오픈 소스들 hooni 2013.04.23 166639
1168 Develop [ios] 언어, 지역, 국가 설정 가져오기 hooni 2014.05.12 153155
1167 Etc 베지어 곡선 (Bezier curve) file hooni 2013.08.18 135481
1166 Develop [android] 만화 어플 소스코드 file hooni 2013.04.23 92581
1165 Develop 레고 마인드스톰 NXT 수도쿠, 큐브 소스코드.. 20 file hooni 2013.04.23 81048
1164 Algorithm 디피헬만(Diffie-Hellman) 초간단 개념.. hooni 2013.04.23 80736
1163 Develop [c#] Hashtable <-> Json (dll 포함) file hooni 2013.04.23 80299
1162 Develop 자주 쓰는 Docker 명령어 alias hooni 2020.01.10 77984
1161 Develop [C#] MD5, SHA1 해시 & 인코딩 hooni 2013.04.23 77363
1160 Develop [android] 점심 해결 앱 소스 코드 ㅋㅋ file hooni 2013.04.23 76168
1159 PPT [android] XML파서(XMLParser)의 종류와 성능 비교에 대한 발표 자료 file hooni 2013.04.23 75372
1158 Develop [json] 종결자 (설명과 웹, C/C++/C# 프로그램 샘플 코드) file hooni 2013.04.23 71792
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 98 Next
/ 98