Contents

조회 수 3274 댓글 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
번호 분류 제목 글쓴이 날짜 조회 수
1161 Develop [iOS] Xcode 불필요한 캐시 삭제하기 hooni 2021.10.12 2461
1160 Develop [swift] 실행시간 측정하기 hooni 2021.09.14 1345
1159 Develop [vim] vim 명령으로 &#65279; 문자 제거하기 (remove 65279 bomb) hooni 2021.02.03 1916
» Develop [js] show/hide 이벤트 감시 (Observing show/hide event) hooni 2021.02.03 3274
1157 Develop [swift] popToRoot 모달뷰, 네비게이션컨트롤러 한꺼번에 닫기 file hooni 2021.01.29 2055
1156 Develop [swift] NotificationCenter 간단 예제 file hooni 2021.01.27 8857
1155 Develop [kotlin] 코틀린 안드로이드 앱 버전/빌드 정보 hooni 2020.12.15 1464
1154 Develop [ubuntu] 우분투 18.04에 PHP5 설치하기 hooni 2020.11.14 1656
1153 System/OS [펌] 마이크로서비스, 모노리포, SRE, ... 덮어놓고 구글 따라하면 안 되는 기술들 file hooni 2020.10.15 1591
1152 Develop [js] Text 값을 클립보드에 복사하기 hooni 2020.10.10 1154
1151 System/OS Apache CORS 설정 1 hooni 2020.09.04 3451
1150 System/OS How to Install and Use wget on Mac file hooni 2020.09.03 2086
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 98 Next
/ 98