阿杰 👍，你问的 Ext.MessageBox 属于 Ext JS 框架中的消息框组件，用于在网页应用中显示提示、确认、警告、输入等对话框。下面我给你整理详细用法：

📝 Ext.MessageBox 用法详解

1. 基本介绍

  • Ext JS 提供 静态类 Ext.MessageBox，不需要实例化。
  • 功能：
    • alert() → 提示消息框
    • confirm() → 确认对话框（有确定/取消按钮）
    • prompt() → 输入框
    • show() → 自定义按钮和内容

2. alert（提示消息框）

Ext.MessageBox.alert('标题', '这是提示信息', function(btn){
    console.log('点击了按钮: ' + btn);
});
  • 参数：
    1. title → 对话框标题
    2. message → 提示信息
    3. fn → 回调函数，参数 btn 返回点击按钮 id（如 'ok'）

3. confirm（确认对话框）

Ext.MessageBox.confirm('确认', '你确定要删除吗？', function(btn){
    if(btn === 'yes'){
        console.log('用户确认删除');
    } else {
        console.log('用户取消删除');
    }
});
  • 默认按钮：Yes / No
  • 回调 btn 值可能为 'yes' 或 'no'

4. prompt（输入框）

Ext.MessageBox.prompt('输入框', '请输入你的姓名：', function(btn, text){
    if(btn === 'ok'){
        console.log('用户输入: ' + text);
    }
});
  • 可获取用户输入文本
  • 默认按钮：OK / Cancel

5. show（自定义消息框）

Ext.MessageBox.show({
    title: '消息',
    msg: '这是自定义消息框',
    buttons: Ext.MessageBox.YESNOCANCEL, // 按钮类型
    icon: Ext.MessageBox.INFO,           // 图标类型：INFO, WARNING, ERROR, QUESTION
    fn: function(btn){
        console.log('点击按钮: ' + btn);
    }
});

常用按钮类型

值描述
OK单个“确定”按钮
OKCANCEL确定 + 取消
YESNO是 + 否
YESNOCANCEL是 + 否 + 取消

常用图标

值描述
Ext.MessageBox.INFO信息图标
Ext.MessageBox.WARNING警告图标
Ext.MessageBox.ERROR错误图标
Ext.MessageBox.QUESTION提问图标

6. 高级用法

  • 进度条/加载提示
Ext.MessageBox.show({
    title: '请稍候',
    msg: '正在加载数据...',
    progressText: '初始化...',
    width: 300,
    progress: true,
    closable: false
});
  • 更新进度
var i = 0;
var f = function(){
    i += 0.1;
    Ext.MessageBox.updateProgress(i, Math.round(i*100) + '%');
    if(i < 1){
        setTimeout(f, 100);
    } else {
        Ext.MessageBox.hide();
    }
};
f();

7. 使用建议

  • 简单提示 → alert()
  • 需要确认操作 → confirm()
  • 需要用户输入 → prompt()
  • 自定义复杂按钮/图标/进度条 → show()
  • 避免在高频率操作中滥用消息框，影响用户体验。