如何在关闭弹出窗口之前保持焦点

时间:2012-06-20 13:53:51

标签: jquery

如何保持对popuP窗口的关注?目前它显示弹出窗口,但是当我点击弹出窗口外的任何地方它关闭窗口时,我想要的是仅当用户单击关闭按钮时才关闭。这是 DEMO

//html:
    <a id='clickShow' class='a'>Click here</a> 
    <div id="popupContact" class='divpopup'>
            <a id="popupContactClose">x</a>
            <h1>Option Image</h1>
            test 123
         </div>
        <div id="backgroundPopup"></div>

// JS:

//SETTING UP OUR POPUP
//0 means disabled 1 means enabled
var popupStatus = 0;
function centerPopup(){
    //request data for centering
    var win = {
            height: $(document).height(),
            width: $(document).width()
        },
        pop = {
            height: $("#popupContact").height(),
            width: $("#popupContact").width()
        };
    $("#popupContact").css({
        "position": "fix",
        "top": win.height/2-pop.height/2,
        "left": win.width/2-pop.width/2
    });
    //only need force for IE6    
    $("#backgroundPopup").css({
        "height": win.height
    });   
}
function disablePopup(){
    //disables popup only if it is enabled
    if(popupStatus==1){
        $("#backgroundPopup, #popupContact").fadeOut();
        popupStatus = 0;
    }
}
function loadPopup(id){
    //centering with css
    centerPopup();
    //loads popup only if it is disabled
    if(popupStatus==0){
        $("#backgroundPopup").css("opacity", "0.7").fadeIn();
        $("#popupContact").fadeIn();
        popupStatus = 1;
        getValueOptionImage($(this).attr('id'));
    };
}
function getValueOptionImage(value) {
    $(".option_radio").unbind("change").change(function(e) {
        alert("a ID: " + value + "\nradio Value: " + $(this).val());
    });
}
$(function() {
    $("a").on("click", loadPopup);
    //CLOSING POPUP
    $("#popupContactClose, #backgroundPopup").click(disablePopup);
    //Press Escape event!
    $(document).keypress(function(e){
        if(popupStatus==1 && e.which==27) disablePopup();
    });
});

1 个答案:

答案 0 :(得分:1)

这是由于你的事件处理程序被注册听取你的关闭和你的背景点击所以改变

$("#popupContactClose, #backgroundPopup").click(disablePopup);

$("#popupContactClose").click(disablePopup);