ExtJs入门教程：简单示例与 MessageBox 使用解析

"这篇资源是关于ExtJS入门的教程，主要介绍了ExtJS中常用的对话框组件 MessageBox 的使用，包括alert、confirm、prompt和show方法，提供了详细的代码示例和参数说明，适合初学者参考学习。" 在ExtJS框架中，Ext.MessageBox是一个非常重要的组件，它提供了一种用户友好的方式来显示消息、警告、确认对话框和获取用户输入。这篇教程以ExtJS 2.0为基础，旨在帮助新手快速掌握ExtJS的基本语法和组件应用。 1. **Ext.MessageBox.alert()** 这个方法用于显示一个简单的警告对话框，包含一个“确定”按钮。它接受三个参数：`title`（对话框标题），`msg`（显示的消息）和`function`（可选的回调函数）。当用户点击“确定”按钮后，回调函数会被执行。例如： ```javascript Ext.MessageBox.alert("title","msg", function(){alert("关闭对话框后弹出!");}); ``` 回调函数的参数`e`代表用户的行为，对于alert，其值通常为`ok`。 2. **Ext.MessageBox.confirm()** confirm方法与alert类似，但增加了用户选择“是”或“否”的选项。回调函数的参数`e`可以是`yes`, `no`或`cancel`，表示用户的选择。 ```javascript Ext.MessageBox.confirm("title","msg", function(e){alert("按钮的值:"+e);}); ``` 3. **Ext.MessageBox.prompt()** prompt方法允许获取用户的输入，具有五个参数：`title`, `msg`, 回调函数, 是否多行 (`multiline`), 和初始输入值。回调函数接收两个参数：`e`（按钮值）和`text`（用户输入的文本）。 ```javascript Ext.MessageBox.prompt("title","msg", function(e, text){alert(e+","+text);}, true); ``` `multiline`参数为true时，输入框变为多行文本框。 4. **Ext.MessageBox.show()** show方法是最灵活的，可以通过配置对象定义各种参数来创建自定义对话框。常见的配置项包括： - `animEl`: 指定对话框出现和消失的动画效果元素。 - `buttons`: 定义对话框上显示的按钮，如`Ext.Msg.OK`, `Ext.Msg.OKCANCEL`等。 通过这些基本的 MessageBox 方法，开发者可以构建丰富的用户交互界面，实现通知、询问和数据收集等功能。随着对ExtJS的深入学习，开发者可以利用更多的组件和API创建复杂的Web应用程序。