jQuery UI 1.7.1 叠加点击时模态关闭

Question

我试图覆盖 jQuery UI 模式对话框的默认行为，以在单击覆盖层时关闭该框。下面的代码将在我第一次打开对话框并单击叠加层后关闭该对话框。当我再次打开对话框时，单击叠加层没有任何反应。我在这里错过了一个事件。有人可以指出我在这里做错了什么吗？

谢谢!

$(function(){

        $('#production_schedule_dialog').dialog({
            autoOpen: false,
            width: 570,
            modal: true,
            closeOnEscape: true
        }); 

        $('#production_schedule_dialog_link').click(function(){
            $('#production_schedule_dialog').dialog('open');
            return false;
        });

        $(document).bind('click', dialogBlur);
});


var dialogBlur = function(event){
    var target = $(event.target);
    if (target.is('.ui-dialog') || target.parents('.ui-dialog').length) {
        return;
    }

    $('.ui-dialog:visible').find('.ui-dialog-titlebar-close').trigger('click');

    $(document).unbind('click', dialogBlur);
}

Answer 1

最简单的方法: http://www.ryanjeffords.com/blog/entry/closing-a-jquery-ui-dialog-when-the-dialog-loses-focus

添加此:

$('.ui-widget-overlay').live("click", function() {
    //Close the dialog
    $("#dialog").dialog("close");
});