williamraym

和我一起学ExtJS——入门

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

在页面上导入所需的ＪＳ和ＣＳＳ资源文件

<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 阅读(1284) 评论(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)

随笔档案

搜索

最新评论

阅读排行榜

评论排行榜