按下ESC时关闭灯箱 [英] Close lightbox when ESC is pressed

问题描述

我试图在按下逃生时关闭灯箱，但弹出窗口没有关闭。

I am trying to close a lightbox when escape is pressed but the popup does not close.

$(document).keypress(function(e){

    if(e.keyCode==27 && popupStatus==1){

        disablePopup();
    }
});

以下是完整代码：

var popupStatus = 0;
var buttonDivID = "";
var conDivID = "";

//determine which div is clicked
function setDiv( div ) {
    if( div==1){
        conDivID = "#intro";
    }
    if( div==2) {
        conDivID = "#presentation";
    }
}

//loading popup with jQuery magic!

function loadPopup(){

    //loads popup only if it is disabled

    if(popupStatus==0){

        $("#backgroundPopup").css({

            "opacity": "0.7"

        });

        $("#backgroundPopup").fadeIn("slow");

        $(conDivID).fadeIn("slow");

        $(conDivID).CenterIt();

        popupStatus = 1;

    }

}

//disabling popup with jQuery magic!

function disablePopup(){

    //disables popup only if it is enabled

    if(popupStatus==1){

        $("#backgroundPopup").fadeOut("slow");

        $(conDivID).fadeOut("slow");

        popupStatus = 0;
        buttonDivID = "";
        conDivID = "";
    }
}



//centering popup

function centerPopup(){

    //request data for centering

    var windowWidth = document.documentElement.clientWidth;

    var windowHeight = document.documentElement.clientHeight;

    var popupHeight = $(conDivID).height();

    var popupWidth = $(conDivID).width();

    //centering

    $(conDivID).css({

        "position": "absolute",

        "top": windowHeight/2-popupHeight/2,

        "left": windowWidth/2-popupWidth/2

    });

    //only need force for IE6

    $("#backgroundPopup").css({

        "height": windowHeight

    });
}

//CONTROLLING EVENTS IN jQuery

$(document).ready(function(){

    $("#vid2").click(function(){
    //set the lightbox divs
    setDiv(2);
    loadPopup();
    });

    //CLOSING POPUP

    //Click the x event!

    $(".popupContactClose").click(function(){

        disablePopup();

    });

    //Press Escape event!

    $(document).keypress(function(e){

        if(e.keyCode==27 && popupStatus==1){

            disablePopup();
        }
    });
});

另一种方法是点击x按钮正确关闭弹出窗口。为什么不关闭呢？

The other method, which is clicking the x button closes the popup correctly. Why doesn't this close it?

推荐答案

这个有效：

$(document).ready(function(){
    $(document).bind('keydown', function(e) { 
        if (e.which == 27) {
            alert('esc pressed');
        }
    }); 
});

这篇关于按下ESC时关闭灯箱的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！