Question

我正在使用jQuery UI来显示一个对话框。我已经使用div作为背景窗口禁用了页面背景的选择，该窗口具有一些不透明度。该对话框有一个关闭按钮，以便在关闭按钮时关闭它，同时隐藏背景窗口。现在，当我按下退出键时，对话框将关闭，但背景仍然显示。如何关闭背景以及单击转义键。

$("#open").click(function(){
    $(".dialog").dialog("open");
     $(".bg-opacity").fadeIn();
});

$("#close").click(function(){
    $(".dialog").dialog("close");
     $(".bg-opacity").fadeOut();
});

由于

Answer 1

抓住转义键keydown并调用close click函数。试试这个：

$(document).keydown(function(e) {
    if (e.keyCode == 27) {
        $("#close").click()
    }   
});

编辑：虽然可以在整个文档中捕获转义，如我的示例最初所做的那样，最好只在对话框打开时捕获转义，以防止在整个文档上不断捕获转义。 / p>

$(NAME_OF_POPUP_DIALOG).keydown(function(e) {
    if (e.keyCode == 27) {
        $("#close").click()
    }   
});

这可能需要您将tabindex="0"属性添加到对话框div中，以允许它具有焦点并检测keydown。

Answer 2

尝试，捕获转义并关闭对话框：

$(document).keydown(function(e) {
    if (e.keyCode == 27) {
        $(".dialog").dialog("close");
        $(".bg-opacity").fadeOut();
    }   
});

jQuery onclick转义键事件

2 个答案: