Ext.MessageBox.alert()彈出對話框詳解

  Ext.MessageBox是一個工具類，他繼承自Obiect對象，用來生成各種風格的信息提示對話框，Ext.Msg是該類的別名，使用Ext.MessageBox和用Ext.Msg效果是一樣的，而后者提供了更簡單的方式。

  語法：Ext.Msg.alert(String title, String msg, Function fn, Object scope);

  參數：

　　　　title:標題

　　　　msg:提示內容

　　　　fn:提示框關閉后自動調用的回調函數

　　　　scope:作用域，用於指定this指向哪里，一般不用

  可使用以下兩種方法

  方法1：

Ext.onReady(function() { 
   Ext.Msg.alert('提示', '逗號分隔參數列表'); //這種方式非常常見的 
}); 

 

 效果圖： 

方法2：

Ext.onReady(function() { 
   //定義 JSON(配置對象) 
   var config = { 
   title:'提示', 
   msg: 'JSON配置方式，簡單吧' 
   } 
   Ext.Msg.show(config); 
}); 

 

 效果圖： 

Ext.MessageBox提供的信息提示框與JavaScript提供的原始信息提示框有3個方面的差別： 

1.實現方式

   標准JavaScript提供的信息提示對話框是一個真正的彈出窗口。Ext.MessageBox提供的信息提示對話框並不是真正的彈出窗口，他只是在當前頁面顯示的一個層(div)

2.顯示信息的格式： 
  標准JavaScript提供的信息提示對話框中顯示的內容不是HTML格式文本，而是純文本。 
不能使用HTML中的格式化方法進行排版，只能以空格、回車以及各種標點符來構建顯示格式。 
Ext.MessageBox提供的信息提示對話框顯示的文本不僅支持純文本顯示還支持用HTML格式文本，采用HTML中的格式化方法進行排版，效果更加豐富多彩。

 標准JavaScript提供的信息提示對話框:

 

<script type="text/javascript"> 
   alert('只能用純文本');//這里不支持HTML格式的字符串 
</script> 

 

效果圖： 

Ext.MessageBox提供的信息提示對話框:

//支持html格式文本 
Ext.onReady(function() { 
   Ext.Msg.alert('<font size=4>提示</font>','<font color=red> 支持html格式文本 </font>'); 
}); 

效果圖： 

3.對程序運行的影響

Ext的MessageBox是異步，和JS的alert是不同，JS的alert執行的時候會掛起代碼，不繼續執行，而Ext的MessageBox是會繼續執行的

<script type="text/javascript"> 
Ext.onReady(function() { 
   alert('我會停止程序的執行'); 
   Ext.Msg.alert('提示','我不會停止程序的執行'); 
}); 
</script> 

效果圖： 

<script type="text/javascript"> 
Ext.onReady(function() { 
   Ext.Msg.alert('提示','我不會停止程序的執行'); 
   alert('我會停止程序的執行'); 
}); 
</script> 

效果圖： 

由於ExtJS的alert是異步執行的不會產生阻塞，因此要將用戶確認后才執行的代碼放在回調函數中