라이트 박스를 닫을 때 이스케이프 키 기능을 추가하는 방법은 무엇입니까?

Question

나는 다음과 같은 스크립트를 사용하여 라이트 박스를 만들어 :

<script type="text/javascript"> 
    $(document).ready(function(){ 
      $(".BtnAction").click(function(){        
       var objPopup = $($(this).attr("rel")); 

       var mask = $("<div/>", { 
        id : "mask", 
        style: "background:#000; display:block;top:0;left:0;position:absolute;opacity:0.8;filter: alpha(opacity=80);width:100%;height:100%;z-index:9998;", 
        click: function(){ 
         $(objPopup).hide(); 
         $(this).remove(); 
        }  
       }); 

       $(".PopupWrap").before(mask); 
       objPopup.show(); 
      }); 

      $(".CloseIcon").click(function(){ 
       $(this).parent().hide(); 
       $("#mask").remove(); 
      }); 

    }); 
</script> 

가 클릭하면, 라이트뿐만 아니라 닫을 수 있도록하는 방법은 ESC 키를 구현할 수있다?

고마워요.

Answer 1

$ (document) .ready() 블록 내의 문서에 esc 키 수신기를 추가하고 $ ('. CloseIcon'). click() 함수에 대해 현재 가지고있는 코드를 반복 할 수 있지만 target 그것으로 라이트 이드의 :

$(document).ready(function(){ 

// Your existing code 

    $(document).keyup(function(e) { 
     if (e.keyCode == 27) { // esc keycode 
      $('#lightboxId').hide(); 
      $('#mask').remove(); 
     } 
    }); 
}); 

https://stackoverflow.com/a/3369624/1010337