jQuery-UI在后台单击关闭模式对话框 [英] jQuery-UI close modal dialog on background click

问题描述

我正在玩jQuery UI，我喜欢这个演示的工作方式: http://jqueryui.com/demos/dialog/#modal-message

但是，出现对话框时，关闭对话框的唯一方法是单击对话框中的界面按钮之一-当用户单击覆盖背景的图层时，如何扩展对话框以关闭任何/给定的对话框上一页?

我看到了用户可以点击退出"的地方，但是坦率地说，我认为大多数用户都不会考虑这样做(直到我将其作为选项时才知道)，但是单击它们可能会发生从消息中.

是否缺少我可以使用的事件/选项?

解决方案

这可以解决问题:

$(".ui-widget-overlay").click(function(){
    $(".ui-dialog-titlebar-close").trigger('click');
});

点击.ui-widget-overlay会触发点击关闭按钮

欢呼

G.

I'm toying with jQuery UI, and I like how this demo works: http://jqueryui.com/demos/dialog/#modal-message

However, when a dialog comes up, the only way to close it is to click one of the interface buttons inside the dialog - how could I extend this to close any/a given dialog when the user clicks on the background layer covering up the page?

I saw where users can hit "escape", but frankly I don't think most users will think to do this (I didn't until I saw it as an option), however it might occur to them to click away from the message.

Is there an event/option I'm missing that I can tap into?

解决方案

That should do the trick:

$(".ui-widget-overlay").click(function(){
    $(".ui-dialog-titlebar-close").trigger('click');
});

Click on .ui-widget-overlay will trigger the click on the close button

Cheers

G.

这篇关于jQuery-UI在后台单击关闭模式对话框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！