창 크기를 조정할 때 jQuery 이벤트의 바인딩 해제/해제 방법

Question

창이 490을 초과하면 jquery 이벤트를 삭제하려고합니다. 그러나 unblind() 또는 off() 요소는 창이 490px보다 작아지면 활성화 된 동작을 비활성화하지 않습니다. 왜 이런거야? 누구든지 선택을 원래 상태로 되돌릴 수있는 방법을 알고 있습니까? 여기

$(document).ready(function(){ 

    $(window).resize(function(){ 
    if ($(window).width()<490) { 
    $("#shown").unbind().click(function(){ 
     event.preventDefault(); 
     $("body div hidden").toggle('slow'); 
    }); 
    } 

    else if ($(window).widht()>=490) { 
     $("#shown").unbind(); 
     $("body div hidden").unbind(); 
    } 
    }); 
}); 

</script> 

Answer 1

는 당신이 달성 할 수있는 방법입니다 원하는 화면 크기에 따라 숨기기 이벤트 바인딩을 해제합니다 아래 코드.

$(document).ready(function() 
 
{ 
 
var eventPresent = false; 
 
$(window).resize(function() 
 
{ 
 
console.log("current width : ", $(window).width()); 
 
    
 
if ($(window).width()<490 && eventPresent == false) 
 
{ 
 
$("#shown").unbind().click(function(event) 
 
{ 
 
    event.preventDefault(); 
 
    $("#divText").toggle('hide'); 
 
}); 
 
eventPresent = true; 
 
}  
 
else if ($(window).width()>=490 && eventPresent == true) 
 
{    
 
    $("#shown").unbind(); 
 
    $("#divText").show() 
 
    eventPresent = false;  
 
} 
 
    }); 
 
}); 
 

 

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> 
 

 
<a id="shown">click me to hide text</a> 
 
    
 
<div id="divText"> 
 
       
 
You can not toggle me if screen is more than 490 px wide 
 
      
 
</div> 
 

P.S는 전체 페이지 모드에서 미리보기를 실행합니다.