廉颇老矣,尚能饭否

java:从技术到管理

常用链接

统计

最新评论

ExtJS学习(1):demo

ExtJS是一个用javascript写的,主要用于创建前端用户界面,是一个与后台技术无关的前端ajax框架。
ExtJS发布包目录
        adapter:负责将里面提供第三方底层库(包括Ext自带的底层库)映射为Ext所支持的底层库。
   build:  压缩后的ext全部源码(里面分类存放)。
   docs:  API帮助文档。
   exmaples:提供使用ExtJs技术做出的小实例。
   resources:Ext UI资源文件目录,如CSS、图片文件都存放在这里面。
   source: 无压缩Ext全部的源码(里面分类存放) 遵从Lesser GNU (LGPL) 开源的协议。
   Ext-all.js:压缩后的Ext全部源码。
   ext-all-debug.js:无压缩的Ext全部的源码(用于调试)。
  ext-core.js:压缩后的Ext的核心组件,包括sources/core下的所有类。
  ext-core-debug.js:无压缩Ext的核心组件,包括sources/core下的所有类。
应用extjs需要在页面中引入extjs的样式及extjs库文件,样式文件为resources/css/ext-all.css,extjs的js库文件主要包含两个,adapter/ext/ext-base.js及ext-all.js,其中ext-base.js表示框架基础库,ext-all.js是extjs的核心库。adapter表示适配器,也就是说可以有多种适配器,因此,可以把adapter/ext/ext-base.js换成adapter/jquery/ext-jquery-adapter.js,或adapter/prototype/ext-prototype-adapter.js等。

index.jsp 代码如下

<%@ page language="java" contentType="text/html; charset=UTF-8"
 pageEncoding="UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Ext welcome you</title>

<link rel="stylesheet" type="text/css"
 href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script type="text/javascript"
 src="extjs/build/locale/ext-lang-zh_CN.js"></script>

<script type="text/javascript">
 //alert("Ext welcome you");
 function btn() {
  Ext.MessageBox.alert('ExtButton', 'ExtButton');
 }

 //Ext.onReady(btn);
 
 Ext.onReady(
 function () { 
  Ext.MessageBox.alert('ExtButton', 'ExtButton');
  }
 );
 
</script>

</head>
<body>
<h1>Ext welcome you</h1>
<div id="hello_in">&nbsp;</div>
<script type="text/javascript">
 var panel = new Ext.TabPanel( {
  width :300,
  height :200,
  items : [ new Ext.Panel( {
   title :"111111111",
   height :30,
   html :'<h1>Hello,aaaaaaaaaaaaaaaa</h1>'
  }), new Ext.Panel( {
   title :"2222222222",
   height :30,
   html :'<h1>Hello,bbbbbbbbbbbbbb</h1>'
  }), new Ext.Panel( {
   title :"33333333333333",
   height :30,
   html :'<h1>Hello,cccccccccccc</h1>'
  }) ]
 });
 panel.render("hello_in");
</script>
</body>
</html>



柳德才
13691193654
18942949207
QQ:422157370
liudecai_zan@126.com
湖北-武汉-江夏-庙山

posted on 2009-01-16 14:47 liudecai_zan@126.com 阅读(3633) 评论(2)  编辑  收藏 所属分类: ExtJS

评论

# 1321 2014-05-12 09:50 3131

1313  回复  更多评论   

# 上面的是啥玩意 2014-05-12 09:50 3131

看不懂  回复  更多评论   


只有注册用户登录后才能发表评论。


网站导航: