如何使用Twitter Bootstrap自动关闭警报？

所有现代Web应用程序都使用警报来向用户显示消息。这些警报具有关闭按钮以将其关闭，或者可以使用Twitter Bootstrap自动关闭。在这篇文章中，我们将使用twitter Bootstrap创建自动关闭警报。

基本思想是使用jQuery setTimeout()方法在指定时间后关闭警报。

句法：

setTimeout(function, delay)

注意：延迟以毫秒为单位定义。 1秒等于1000毫秒。

示例1：在此示例中，使用ID在脚本中访问警报，然后在5秒钟后关闭警报。

HTML

  

    
          How to Automatically Close Alerts 
          using Twitter Bootstrap ?
      
  
    
    
  
    
    
    
  
    
    
    

  

    Automatically closing the alert
  
    
    
        This alert will automatically 
        close in 5 seconds.
    
  
    
        setTimeout(function () {
  
            // Closing the alert
            $('#alert').alert('close');
        }, 5000);
    

  

示例2：在此示例中，使用脚本的类访问警报，警报在2秒后关闭。

的HTML

  

    
    
          How to Automatically Close Alerts 
          using Twitter Bootstrap ?
    
  
    
    
  
    
    
    
      
    
    
    

  

    Automatically closing the alert
      
    
    
        This alert will automatically 
        close in 2 seconds.
    
  
    
        setTimeout(function () {
  
            // Closing the alert
            $('.alert').alert('close');
        }, 2000);
    

  

示例3：在此示例中，动态添加了bootstrap hide类以警报，并在5秒后关闭警报。 addClass()是用于使用JavaScript将类添加到任何元素的方法。

的HTML

  

    
  
    
        How to Automatically Close Alerts
        using Twitter Bootstrap ?
    
  
    
    
  
    
    
    
  
    
    
    

  

    Automatically closing the alert
  
    
    
        This alert will automatically 
        close in 5 seconds.
    
  
    
        setTimeout(function () {
  
            // Adding the class dynamically
            $('#alert').addClass('hide');
        }, 5000);
    

  

输出：