jQuery UI对话框中关闭（x）按钮的专用事件处理程序

Question

有没有办法连接到jQuery UI对话框上的close（x）按钮，这样你就可以提供专用的事件处理程序？ 使用“close”或“beforeclose”事件不起作用，因为如果对话框中还有其他按钮也会导致对话框关闭，那么您总是会遇到“关闭”和“关闭前”事件，这是不可取的。 我想要一种从close（x）按钮运行特定代码的方法。

Answer 1

每当一个事件导致jQuery UI小部件中的另一个事件时，原始事件总是包含在事件对象中。 在这种情况下，您可以查看传递给close回调或dialogclose事件的事件对象，并检查event.originalEvent存在。 如果是，则可以假设通过单击关闭按钮关闭对话框。 这也适用于beforeclose 。

如果你想绝对确定它是标题栏中的关闭按钮，那么你可以检查event.originalEvent.target并使用.closest()检查类或DOM位置。

这里有一个jsbin显示了这个： http ：//jsbin.com/ajoheWAB/1/edit

Answer 2

你可以尝试：

$(document).on('click','.ui-dialog-titlebar-close',function(){
    //close button clicked
});

Answer 3

据我所知，没有办法直接连接到该按钮，但您可以通过添加dialogClass并自行连接事件处理程序来为弹出窗口执行特定操作：

var dialogClass ="yourPopupTitle";

$(document).on('click', '.'+ dialogClass  +' .ui-dialog-titlebar-close', function() { 
    handleEvent();
});

小提琴

Answer 4

我相信这是您正在寻找的解决方案 - 您需要取消绑定click事件并将自定义处理程序重新绑定到它。

虽然这个帖子已经老了，但我仍然在这里添加我的解决方案，希望能够让其他搜索它的人受益。

var fnCustomerHandler = function() {
    alert("Here is your custom handler...");  
};

$( "#dialog" ).dialog({
        open: function(event, ui) {
            var el = $(this).closest('.ui-dialog').find('.ui-dialog-titlebar-close');
            el.off();
            el.on("click", fnCustomerHandler);
        }
    }
);

小提琴链接：

http://jsfiddle.net/morefool/n82649d5/