williamraym

和我一起学ExtJS——入门

先从官方下载Extjs 2.0http://www.extjs.com/

在页面上导入所需的JS和CSS资源文件

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />

<link rel="stylesheet" type="text/css" href="plugins/extjs/ext-2.0/resources/css/ext-all.css" />
<style type="text/css">
    @import url("plugins/extjs/ext-2.0/resources/css/ext-all.css");
</style>
<script type="text/javascript" src="plugins/extjs/ext-2.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="plugins/extjs/ext-2.0/ext-all.js"></script>
</head>
<body>
<div id="id1" style="border:1px solid red;height:200px;width:200px;">id1的范围,请用mouse 左键点击</div>
<div id="id2" style="border:1px solid red;height:200px;width:200px;">id2的范围,请用mouse 左键点击</div>

来一个实例,最常见的ID元素操作
传统的操作:
<script type="text/javascript">
    
var d=document.getElementById("id1");
    d.onclick
=function(){
        alert(
"你点击了id1");
    }

Extjs里的实现:

    var t=Ext.get('id2');
    t.center();
    t.on('click',
function(){
        alert(
"dfsdfsd");
        t.highlight();
    }
,this,
    
{single: false,
    delay: 
100}

    );
});
</script>
</body>
</html>

如果使用easyjweb就可以直接用以下代码了

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
$html.extjs2()
<title>跟我一起学Extjs——入门</title>
</head>
<body>
<div id="id1" style="border:1px solid red;height:200px;width:200px;">id1的范围,请用mouse 左键点

</div>
<div id="id2" style="border:1px solid red;height:200px;width:200px;">id2的范围,请用mouse 左键点

</div>
<script type="text/javascript">
Ext.onReady(
function(){
    
var t=Ext.get('id2');
    t.center();
    t.on('click',
function(){
        alert(
"dfsdfsd");
        t.highlight();
    }
,this,
    
{single: false,
    delay: 
100}

    );
}
);
</script>
<script type="text/javascript">
    
var d=document.getElementById("id1");
    d.onclick
=function(){
        alert(
"你点击了id1");
    }

</script>
</body>
</html>

posted on 2008-01-08 16:22 WilliamRaym 阅读(1287) 评论(6)  编辑  收藏

评论

# re: 和我一起学ExtJS——入门 2008-01-08 17:02 wellfuls

不错,真是一个很好的学习开端,谢谢!  回复  更多评论   

# re: 和我一起学ExtJS——入门 2008-01-08 17:03 wellfuls

收获不小,真希望有后续文章  回复  更多评论   

# re: 和我一起学ExtJS——入门 2008-01-08 17:05 久城

up!~最近我也在学哈哈, 多多指教!~  回复  更多评论   

# re: 和我一起学ExtJS——入门 2008-01-08 18:31 WilliamRaym

一起进步,哈哈
  回复  更多评论   

# re: 和我一起学ExtJS——入门 2008-01-08 22:03 xidudui

很有用,多谢诶  回复  更多评论   

# re: 和我一起学ExtJS——入门 2008-01-09 09:19 WLR

更多,请敬请期待  回复  更多评论   


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


网站导航:
 
<2008年1月>
303112345
6789101112
13141516171819
20212223242526
272829303112
3456789

导航

统计

常用链接

留言簿(6)

随笔档案

搜索

最新评论

阅读排行榜

评论排行榜