如何添加退出鍵功能以關閉燈箱？

我使用下面的腳本創建的收藏夾：如何添加退出鍵功能以關閉燈箱？

<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鍵，以便單擊時，燈箱會關閉呢？

非常感謝。

來源

2012-06-12 Ori

您可以在$（document）.ready（）塊中的文檔中添加一個esc關鍵字偵聽器，然後重複您當前擁有的$（'。CloseIcon'）。click（）函數的代碼，通過它收藏的ID：

$(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

來源

2012-06-12 23:53:09 ActiveDan

哇，太感謝你了！這肯定有幫助。因爲我有一個由不同的選擇有針對性的幾個燈箱，我改變了代碼爲： \t //逃生功能 \t的$（document）.keyup（函數（E）{ \t如果（e.keyCode = （'＃popup1，＃popup2，＃popup3，＃popup4，＃popup5'）。hide（）; \t $（'＃mask'）。remove（）; \t } \t}）; – Ori

很高興幫助，最後一件事;而不是通過它的唯一標識來定位每個燈箱，也許可以爲他們添加一個類，例如，您可以使用它們來定位所有燈箱。 $（ 'JS-收藏夾'）。這樣，如果你添加/刪除一些你不需要改變腳本。 – ActiveDan

如何添加退出鍵功能以關閉燈箱？

回答

相關問題