javascript
实用ExtJS教程100例-002:MessageBox的三种用法
在上一節中,我們用到了MessageBox,在本文中,我們將介紹一下ExtJS中常用的三種MessageBox。
Ext.MessageBox.alert()
這個方法用來打開一個普通的對話框,對話框中只顯示一個確定按鈕。
Ext.get("btn1").on("click", function () {Ext.MessageBox.alert("提示", "按鈕被點擊"); });- 第一個參數為標題欄
- 第二個參數為內容
效果如下圖【查看在線示例】:
Ext.MessageBox.confirm()
這個方法將打開一個包含yes/no按鈕的對話框,通常用來提示用戶是否要執行敏感操作(例如刪除數據等,需要用戶再次確認,防止誤操作)
Ext.get("btn2").on("click", function () {Ext.MessageBox.confirm("提示", "是否要跳轉頁面?", function (btnId) {if (btnId == "yes") {alert("點擊了yes按鈕");}else if (btnId == "no") {alert("點擊了no按鈕");}else {alert("沒有點擊按鈕,關閉了提示框");}}); });這個方法的回調函數包含了btnId參數,參數值可以是yes或no。
效果如下圖【查看在線示例】:
Ext.MessageBox.prompt()
接下來是第三種對話框,這中對話框中包含一個輸入框和ok/cancel按鈕。在回調函數中我們可以處理用戶的輸入,回調函數中包含了btnId和text兩個可用的參數,示例代碼如下:
Ext.get("btn3").on("click", function () {Ext.MessageBox.prompt("提示", "請輸入用戶名", function (btnId, text) {if (btnId == "ok") {alert(text);}else {alert("點擊了取消按鈕");}}); });在用戶輸入了文字并點擊確定按鈕以后,我們將會彈出對話框。
【查看在線示例】
另外,這個方法還允許創建一個多行的輸入框,代碼如下:
Ext.MessageBox.prompt("提示", "請輸入用戶名", function (btnId, text) {if (btnId == "ok") {alert(text);}else {alert("點擊了取消按鈕");} }, window, true);第三個參數window是默認的作用域
第四個參數是否為多行輸入框,傳入true就表示可以輸入多行文字
運行效果如下【查看在線示例】:
最后一個功能是,如果我們需要在打開的時候顯示一段默認文字,我們可以傳入第五個參數,代碼如下:
Ext.MessageBox.prompt("提示", "請輸入用戶名", function (btnId, text) {if (btnId == "ok") {alert(text);}else {alert("點擊了取消按鈕");} }, window, true, "這是默認文字");運行效果如下【查看在線示例】:
OK,常用的三種對話框已經完成了。
本文還發布在了ExtJS教程網站起飛網上面,如果轉載請保留本段聲明,謝謝合作。
轉載于:https://www.cnblogs.com/youring2/p/extjs-100-examples-002-messagebox.html
總結
以上是生活随笔為你收集整理的实用ExtJS教程100例-002:MessageBox的三种用法的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: iis 重新安装后 重新注册asp.ne
- 下一篇: Centos下chef安装、部署