Question

我遇到了一些问题，我无法在叠加层外单击以关闭它。我想知道是否有人有任何建议。这是一个非模态对话框。

$b("#rl_cover").click(function() {
    var overlayWidth = getWidth();

    var overlay = $b( "#rl_resize" ).dialog({
        width:overlayWidth,
        minWidth:962,
        height: 700,

        resizable:true,
        position: {
            my: "center top",
            at: "center top",
            of: "#bl_main_wrapper",
            collision: "none"
        }   
    });

});

$b("#closex").click("rl_resize", function( event, ui ){
    $b("#rl_resize").dialog( "close" );
});

请告知。

除此之外，我还试图添加一个函数来检测我何时点击文档，但是这样做很奇怪，比如在我没有点击任何地方时显示警报。

$b(document).click(function(e){
    alert('lk');
    closeme(e);
});

Answer 1

我认为你可以使用这个想法：

How do I detect a click outside an element?

您需要将点击事件附加到html：

$("html").on("click", function() {
    // Perhaps detect if dialog is open. Less expensive than close.
    $("#rl_resize").dialog("close");
});

然后你需要对话：

$("#rl_resize").click(function(e) {
    e.stopPropagation();
});

因此，这应该允许所有点击事件在您的html中冒泡，除非您的对话框中包含那些事件。

你可以让你的对话模态化。当你点击它关闭它时，它应该工作：

$(".ui-widget-overlay").on("click", function() {
    $("#rl_resize").dialog("close");
});

Jquery UI对话框窗口非模态视图单击外部关闭它

1 个答案: