extjs学习笔记（一） 一些基础知识

核心提示： 使用ie或者ff打开Hello.htm，可以看到一个弹出的对话框，extjs学习笔记（一） 一些基础知识(2)，和js的alert对话框一样，但是漂亮了许多，新建一个web应用程序ExtjsDemo，删掉自动添加的default.aspx文件，我们看看代码，在html页面中首先引用extjs的相

使用ie或者ff打开Hello.htm，可以看到一个弹出的对话框，和js的alert对话框一样，但是漂亮了许多。

我们看看代码，在html页面中首先引用extjs的相关库文件，注意引用顺序，接下来是引用我们自己的js文件。我们简单看下，Ext.onReady 是在文档加载完之后触发的，它有一个参数是一个函数类型，该函数在事件出发的时候被调用。在这里我们用了匿名的函数，当然也可以把函数在外部定义好，然后把函数的名字作为参数传递进来。Ext.MessageBox.alert是一个弹出消息的对话框函数，第一个参数是标题，第二个参数是对话框的内容。 Ext.Message类下还有模拟js的prompt对话框和comfirm对话框的方法，我们改动下daben.js看看confirm方法的效果：

　1/**//*
　2　*作者：大笨
　3　*日期：2009-10-10
　4　*版本：1.0
　5　*博客地址：http://yage.blogs.com
　6　*/
　7Ext.onReady(function(){
　8　　　　//Ext.MessageBox.alert("信息","Hello　world");
　9　　　　Ext.MessageBox.confirm("comfirm","模拟js的comfirm对话框",function(btn){
10　　　　　　　　alert("点击了"+btn+"按钮");
11　　　　});
12});

光看对话框并不是很有趣，实际的web程序中，需要向服务器提交数据并根据服务器的响应来更新页面中的内容，我们来看看extjs是如何实现的。下边的例子中，我们将在页面上放置一个编辑框和一个按钮，当点击按钮之后，服务器将编辑框中输入的内容转化为大写并显示在页面的一个div中。打开vs2008，新建一个web应用程序ExtjsDemo，删掉自动添加的default.aspx文件。添加我们的hello.htm和daben.js文件以及我们要用到的extjs库，添加完成后如图所示：