on()으로 hide()를 사용하는 데 도움이 필요합니다.

Question

누군가가 on()을 사용하여 hide 함수를 구현하는 방법을 알려주실 수 있습니까? 나는 시도했다 :

$(document).on('hide','selector'); 
    $(document).on('selector', function(){ 
     $(this).hide(); 
    }); 

on()을 사용하여 이러한 함수를 올바르게 적용하는 방법을 알고 싶다.

Answer 1

.on 기능은 무엇인가에 이벤트을 배선하는 데 사용됩니다. 당신은 심지어 무엇을 연결할 지 말하지 않습니다. 요소를 언제 숨기시겠습니까? 버튼을 클릭 할 때 숨길 수 있다고 가정 해 봅시다.

HTML :

<div id="a">This will hide</div> 
<button id="b">Hide!</button>​ 

jQuery를 :

$(document).on('click', '#b', function() { 
    $('#a').hide(); 
});​ 

당신이 방금 $('#a').hide();를 호출하고 요소를 숨길 것없는 이벤트 또는 아무것도에 의해 트리거 요소를 숨기려고하는 경우. 물론 HTML로 작업 할 선택기를 변경하십시오.

바이올린 : http://jsfiddle.net/gromer/Zq756/

편집 :

흥미 롭. 동적으로 추가되는 요소를 제어 할 수 있습니까? 그렇다면 추가 할 때 숨기고 싶은 요소에 클래스를 추가합니다. 뭔가 같이 : 당신의 CSS에 다음

<div class="initial-hide">This div should be hidden when it's loaded.</div>

,이 추가 요소가 initial-hide 클래스를로드 할 때마다

.initial-hide { 
    dislay: none; 
} 

그런 다음, 그것을 숨길 수 있습니다. 이 업데이트 된 피들보기 : http://jsfiddle.net/gromer/Zq756/1/. 추가 버튼은 추가 된 클래스가 어떻게 도움이되는지 보여줍니다.

Answer 2

자바 스크립트에서 캡처 할 on hide 또는 on show 이벤트가 없습니다. 당신이하는 일은 엘리먼트의 숨김을 포착하고 커스텀 기능을 보여주고 붙이는 것입니다.

$('element').hide(delay, onHide); 

function onHide(){ 
    //do whatever 
} 

$('element').show(delay, onShow); 

function onShow(){ 
    //do whatever 
}