在 jquery ui 对话框外定位关闭图像按钮答案

【问题标题】：position close imagebutton outside jquery ui dialog在 jquery ui 对话框外定位关闭图像按钮
【发布时间】：2012-09-16 16:40:57
【问题描述】：

我想把关闭图像按钮放在 jquery ui 对话框之外。

这是我的代码：

CSS：

 .Close
    {
        position:absolute;
        overflow:auto;
        height:25px;
        width:35px;
        right: -34px;
        top: 3px;
    }

这是 Asp.NET 代码：

<div id="dialog" class="dialog ">
    <asp:ImageButton ID="btnCancelpopup" runat="server" ImageUrl="~/Images/quit.png" CssClass="Close"/>
</div>

这是 JavaScript 代码：

$(function(){
$("#dialog").dialog({
            maxWidth: 600,
            maxHeight: 585,
            height: 450,
            width: 600,
            modal: true,
            autoOpen: false,
            resizable: false,
            show: "blind",
            hide: "explode",
            open: function (event, ui) { $(".ui-dialog-titlebar-close").hide(); }
        });
});

【问题讨论】：

标签： jquery asp.net css

【解决方案1】：

您可以手动将事件绑定到外部元素。

$('#btnCancelpopup').click(function () {
     $('#dialog').dialog('close');
}

【讨论】：

不，我希望关闭按钮在显示时位于对话框之外
但是使用此解决方案，您可以将“#btnCancelpopup”放在对话框之外，并在对话框打开事件中显示/隐藏。