如何使用 JavaScript 隐藏 Bootstrap 模式？

本文将告诉我们.modal （模态窗口）关闭时引导程序如何执行。在某个时间点，模态窗口——无论何时打开（与类模态一起），它都会关闭。
一旦模式完成，在对用户隐藏之后，事件就会被触发。每当模态窗口被隐藏时，该函数将被执行，并且以下语法将被触发。顺便说一句，它会在立即消失之前呼叫呼叫者/用户。而且，这根本不是由用户管理的。 Bootstrap 库已经内置，它将为您完成最大的工作。

当 Bootstrap 模态即将被隐藏或隐藏Bootstrap 模态时，将使用以下语法。
句法：

hide.bs.modal

示例：此示例显示hide.bs.modal的用法。

  

    
      GeeksForGeeks
  
    
      Hide Bootstrap Modal
  
    
    
    
  
    
  
    
        #myBtn {
            width: 300px;
            padding: 10px;
            font-size: 20px;
            position: absolute;
            margin: 0 auto;
            right: 0;
            left: 0;
            bottom: 50px;
            z-index: 9999;
        }
    

  

    
        Modal Events - hide.bs.modal
        
        
          Hide Modal
      
        
        
            
                
                
                    
                        
                          ×
                        
                        
                          Modal Header: GeeksForGeeks
                        
                     
                     
                        The hide.bs.modal 
                          is going to hide the modal.
                        If you wish to trigger the modal and 
                          see the modal get hidden, then press
                          the 'HIDE MODAL' button.
                       
                    
                
            
        
    
    
        $(document).ready(function() {
            $("#myModal").modal("show");
  
            $("#myBtn").click(function() {
                $("#myModal").modal("hide");
            });
  
            $("#myModal").on('hide.bs.modal', function() {
                alert('The modal is about to be hidden.');
            });
        });
    

  

输出：
当我们加载代码时：

当我们点击“X”按钮时：

弹出窗口：

结果：

工作：