在JQuery弹出关闭按钮“ X”上调用JS

Question

我弹出一个jQuery：

    <script type="text/javascript">
     function showAccessDialog() {
        var modal_dialog = $("#modal_dialog");
         modal_dialog.dialog
         (
            {
             title: "Access Level",
             buttons: 
             {
             },
             modal: true,
             width:680,
            }
         ).parent().appendTo("form:first");
     };

     function closeAccessDialog() {
         var modal_dialog = $("#modal_dialog");
            modal_dialog.dialog('close');
     };
</script>

    <div id="modal_dialog" style="display: none; width:500"> 
       <asp:Panel ID="SelectGroupsPanel" runat="server" BackColor="Snow" Width="500"
           HorizontalAlign="Center">
           <asp:UpdatePanel runat="server" ID="SelectGroupsUpdatePanel" UpdateMode="Conditional" ChildrenAsTriggers="false">
               <ContentTemplate>
                   <p style="color:red; text-align: left">Select groups from the drop downs</p>
                   <p style="text-align: left">
                       View Map
                       <br />
                       <asp:DropDownList ID="ddlViewMapGroupName" AppendDataBoundItems="true" runat="server">
                        <asp:ListItem Text="Select Group" Value="0" Selected="True"></asp:ListItem>
                       </asp:DropDownList>
                   </p>
                   <p style="text-align: left">
                       Edit Map
                       <br />
                       <asp:DropDownList ID="ddlEditMapGroupName" AppendDataBoundItems="true" runat="server">
                       <asp:ListItem Text="Select Group" Value="0" Selected="True"></asp:ListItem>
                       </asp:DropDownList>
                   </p>
                   <div class="buttonwrap">
                       <span id="Span5" class="ActionBtns">       
                       </span>
                   </div>
                   <br />
                   <br />
               </ContentTemplate>
               <Triggers>
                   <asp:AsyncPostBackTrigger ControlID="SaveAccess" EventName="Click" />
                    <asp:AsyncPostBackTrigger ControlID="ShareMapsBtn" EventName="Click" />
               </Triggers>
            </asp:UpdatePanel>   
            <asp:Button ID="SaveAccess" runat="server" Text="Update" OnClick="SaveAccess_Click" OnClientClick="uncheckAllCheckboxes()" style="text-align:center" />
       </asp:Panel>
   </div>

我的问题是-当用户从下拉列表中选择值并单击“更新”按钮时，调用“ OnClientClick =“ uncheckAllCheckboxes（）””，这将删除所有选中的复选框。 -工作。

如果用户按下弹出窗口右上方的“ X”按钮，我也想调用“ uncheckAllCheckboxes（）”

我怎样才能做到这一点？

Answer 1

jQuery-UI对话框具有close功能：

modal_dialog.dialog({
    title: "Access Level",
    buttons: {},
    modal: true,
    width: 680,
    close: function() {
        uncheckAllCheckboxes();
    }
});

演示版

旁注：使用closeOnEscape: true选项closeOnEscape: true ，如果用户按下escape按钮，关闭功能也会触发。

参考

对话框-关闭

Answer 2

$( ".selector" ).dialog({
  close: function( event, ui ) {
        //write your function here or call function here
  }
});

文献

有用的链接