开眼看世界,初识ExtJS之HelloWorld

yadsun

浏览: 181369 次
性别:
来自: 上海

最近访客更多访客>>

jackuhan

ly23941083

xiangkun

stjauns

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

ExtJS

EXT Eclipse HTML IDE Tomcat

开始学习ext,先从helloworld开始
准备工作-搭建Ext的工作环境：
    下载Ext:http://www.extjs.com/products/extjs/download.php
    IDE：eclipse with Spket plugin Spket是目前最好的Ext IDE，提供Eclipse插件,可以手动下载也可以通过eclipse的自动安装和更新自动安装，update site: http://www.spket.com/update,需要重起eclipse生效
    配置js文件的编缉器:Window-->Preferences-->Spket-->JavaScript Profiles-->点右侧的New在弹出框中输入"ExtJS"-->选中ExtJS点右侧Add Library选择ExtJS-->选中ExtJS点右侧的Add File选择下载的Ext包下的ext.jsb2-->选中ExtJS点右侧的default
新建工程：
   -- 新建一个Web工程extjsDemo
   -- 将Ext解压后的包拷到webcontent下
   -- 新建文件夹html
   -- 在html文件夹下新建第一个html helloworld.html,代码如下

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!--引入ext样式表-->
<link rel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css" />
<!--引入ext适配器脚本-->
<script type="text/javascript" src="../extjs/adapter/ext/ext-base.js"></script>
<!--引入ext框架脚本-->
<script type="text/javascript" src="../extjs/ext-all-debug.js"></script>
<script type="text/javascript">
	Ext.onReady(function() {
		var win;
		win = new Ext.Window({
				applyTo : 'hw',
				title : 'HelloWorld',
				width : '400',
				height : '200',
				items: new Ext.Component({
					xtype : 'textarea',
					html : '开眼看世界，ExtJS的世界多么美好！'
				}),
				buttons: [{
	                    text: 'Close',
	                    handler: function(){
	                        win.close();
	                    }
	                }],
				frame : true
			});
		win.show(this);
	});
</script>
</head>
<body>
<div id="hw"></div>
</body>
</html>

    --编译布署到tomcat服务器下
    --访问http://localhost:8080/extjsDemo/html/helloworld.html

虽然很简单也算是起步了，先学会爬才能学会走，然后才可能会跑...一步一步来吧，加油！有了ext就可以告别eclipse plugin了,啊...世界多美好！抓紧时间学习...

2
顶

0
踩

分享到：

ExtJS--根据用户权限动态创建菜单树 | Swt/Jface tableviewer 加入filter ,改变行 ...

2009-12-22 21:17
浏览 3198
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论