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();
});

FIDDLE

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/

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

4 个答案: