在上一節(jié)中，我們用到了MessageBox，在本文中，我們將介紹一下ExtJS中常用的三種MessageBox。

Ext.MessageBox.alert()

這個(gè)方法用來(lái)打開一個(gè)普通的對(duì)話框，對(duì)話框中只顯示一個(gè)確定按鈕。

Ext.get("btn1").on("click", function () {Ext.MessageBox.alert("提示", "按鈕被點(diǎn)擊"); });

• 第一個(gè)參數(shù)為標(biāo)題欄
• 第二個(gè)參數(shù)為內(nèi)容

效果如下圖【查看在線示例】：

Ext.MessageBox.confirm()

這個(gè)方法將打開一個(gè)包含yes/no按鈕的對(duì)話框，通常用來(lái)提示用戶是否要執(zhí)行敏感操作（例如刪除數(shù)據(jù)等，需要用戶再次確認(rèn)，防止誤操作）

Ext.get("btn2").on("click", function () {Ext.MessageBox.confirm("提示", "是否要跳轉(zhuǎn)頁(yè)面？", function (btnId) {if (btnId == "yes") {alert("點(diǎn)擊了yes按鈕");}else if (btnId == "no") {alert("點(diǎn)擊了no按鈕");}else {alert("沒(méi)有點(diǎn)擊按鈕，關(guān)閉了提示框");}}); });

這個(gè)方法的回調(diào)函數(shù)包含了btnId參數(shù)，參數(shù)值可以是yes或no。

效果如下圖【查看在線示例】：

Ext.MessageBox.prompt()

接下來(lái)是第三種對(duì)話框，這中對(duì)話框中包含一個(gè)輸入框和ok/cancel按鈕。在回調(diào)函數(shù)中我們可以處理用戶的輸入，回調(diào)函數(shù)中包含了btnId和text兩個(gè)可用的參數(shù)，示例代碼如下：

Ext.get("btn3").on("click", function () {Ext.MessageBox.prompt("提示", "請(qǐng)輸入用戶名", function (btnId, text) {if (btnId == "ok") {alert(text);}else {alert("點(diǎn)擊了取消按鈕");}}); });

在用戶輸入了文字并點(diǎn)擊確定按鈕以后，我們將會(huì)彈出對(duì)話框。

【查看在線示例】

另外，這個(gè)方法還允許創(chuàng)建一個(gè)多行的輸入框，代碼如下：

Ext.MessageBox.prompt("提示", "請(qǐng)輸入用戶名", function (btnId, text) {if (btnId == "ok") {alert(text);}else {alert("點(diǎn)擊了取消按鈕");} }, window, true);

第三個(gè)參數(shù)window是默認(rèn)的作用域

第四個(gè)參數(shù)是否為多行輸入框，傳入true就表示可以輸入多行文字

運(yùn)行效果如下【查看在線示例】：

最后一個(gè)功能是，如果我們需要在打開的時(shí)候顯示一段默認(rèn)文字，我們可以傳入第五個(gè)參數(shù)，代碼如下：

Ext.MessageBox.prompt("提示", "請(qǐng)輸入用戶名", function (btnId, text) {if (btnId == "ok") {alert(text);}else {alert("點(diǎn)擊了取消按鈕");} }, window, true, "這是默認(rèn)文字");

運(yùn)行效果如下【查看在線示例】：

OK，常用的三種對(duì)話框已經(jīng)完成了。

本文還發(fā)布在了ExtJS教程網(wǎng)站起飛網(wǎng)上面，如果轉(zhuǎn)載請(qǐng)保留本段聲明，謝謝合作。

轉(zhuǎn)載于:https://www.cnblogs.com/youring2/p/extjs-100-examples-002-messagebox.html

總結(jié)

以上是生活随笔為你收集整理的实用ExtJS教程100例-002：MessageBox的三种用法的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。