调用JQuery弹出关闭按钮上的JS'X'

call JS on JQuery popup close button 'X'

本文关键字：JS JQuery 关闭按钮 调用      更新时间：2023-09-26

我有一个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>

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

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

我该怎么做？

jQuery UI的对话框有一个close-函数： 
modal_dialog.dialog({
    title: "Access Level",
    buttons: {},
    modal: true,
    width: 680,
    close: function() {
        uncheckAllCheckboxes();
    }
});

演示

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

参考

对话框-关闭

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

文档

使用完整链接

相关文章：