[ExtJS2.1教程-1]HelloWorld
ExtJS:一个很强大的ui库
创建一个漂亮的alert "helloworld"
Ext.onReady 表示当全部资源加载之后再操作里面的内容。
当然好的程序离不开好的ide的支持
推荐使用 spket
当然一个alert远远不足以表达ext的优秀，我们再来一个helloPanel
我们再看看 简单的布局
当使用布局之后 发现无需渲染就直接分割了 不过我们的This is my HTML page. 也不显示了
如果我们使用ie对进行打开 将报错
解决办法 实际上<body>中的This is my HTML page. <br>这句话在这里本身就不起作用 我们删除之后ie下就可以正常显示了 当然在其它页面也有可能发生，只需将类似的内容去掉就可以了
不过在第alert("hello")中在ie下还是会出现偏移的情况
Ext.Msg.alert("hello","helloworld000000000000000000000000");
第一个参数是title 第二参数是内容 我们可以把内容用空格填充伸长，这应该算是ext的一个bug了吧
工具的安装 java -jar spket-1.6.11.jar
创建一个漂亮的alert "helloworld"
Ext.onReady(function(){
Ext.Msg.alert("hello");
});
Ext.onReady 表示当全部资源加载之后再操作里面的内容。
当然好的程序离不开好的ide的支持
推荐使用 spket
当然一个alert远远不足以表达ext的优秀，我们再来一个helloPanel
<html>
<head>
<title>hello</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all.css">
<script type="text/javascript" src="./ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="./ext/ext-all.js"></script>
<script>
Ext.onReady(function(){
var panel = new Ext.Panel({
id:'panel_hello',
title:'hellotitle',
width:200,
height:200
});
//对那个id="hello"的div进行渲染
panel.render("hello");
});
</script>
</head>
<body>
This is my HTML page. <br>
<div id="hello"></div>
</body>
</html>
我们再看看 简单的布局
<html>
<head>
<title>hello</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all.css">
<script type="text/javascript" src="./ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="./ext/ext-all.js"></script>
<script>
Ext.onReady(function(){
var viewport = new Ext.Viewport({
id:'desk',
//布局类型，不熟悉的去看看GUI 类似的 什么流式，网格
layout:'border',
//中间自动填充
items:[{region:'north',height:50},{region:'west',width:200},{region:'center'}]
})
});
</script>
</head>
<body>
This is my HTML page. <br>
<div id="hello"></div>
</body>
</html>
当使用布局之后 发现无需渲染就直接分割了 不过我们的This is my HTML page. 也不显示了
如果我们使用ie对进行打开 将报错
解决办法 实际上<body>中的This is my HTML page. <br>这句话在这里本身就不起作用 我们删除之后ie下就可以正常显示了 当然在其它页面也有可能发生，只需将类似的内容去掉就可以了
不过在第alert("hello")中在ie下还是会出现偏移的情况
Ext.Msg.alert("hello","helloworld000000000000000000000000");
第一个参数是title 第二参数是内容 我们可以把内容用空格填充伸长，这应该算是ext的一个bug了吧
工具的安装 java -jar spket-1.6.11.jar