`
jsczxy2
  • 浏览: 1255223 次
  • 性别: Icon_minigender_1
  • 来自: 常州
文章分类
社区版块
存档分类
最新评论

EXT 3.x 使用详解之Ext.Window

    博客分类：
  • ext
EXTJavaScriptjQueryCSSHTML 
阅读更多

这个是最基础的ext使用了，首先先确定要引入source里面哪些内容：

 <link rel="stylesheet" type=text/css href="${ctxPath }/styles/ext-all.css" />
 <script type="text/javascript" src="${ctxPath }/scripts/jquery.js"></script>
 <script type="text/javascript" src="${ctxPath }/scripts/ext/ext-base.js"></script>
 <script type="text/javascript" src="${ctxPath }/scripts/ext/ext-all.js"></script>

 

OK 还有呢？当然是图片了，继续引入ext的图片：ext-3.1.1\resources\images  里的东西放到

${ctxPath }/images路径即可，以后的详解这些都不介绍了，直接写源代码了哟...

 

好吧，上jsp代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page pageEncoding="UTF-8"%>
<<html>
<body>
  <script>
Ext.onReady(function(){
	var win = new Ext.Window({
		draggable : false,
		modal : true,
		title : "Ext.Window",
		resizable : false,
		width : 350,
		height : 300,
		html : "Hi, my name is Ext.Window!",
		buttonAlign : "center",
		buttons : [{text:"setTitle",handler:changeTitle},{text:"close",handler:closeTitle}]
	});			
			
	function changeTitle(){
		win.setTitle('标题被改变了！');
	}
	
	function closeTitle(){
		win.close();
	}
			
	win.on({show : function(win){
		   win.setTitle('win显示的时候改变了Title');
	          }		
	});
			
	win.show();
});
    </script>
</body>
</html>

 

把这段贴进去，就可以看到效果了，恩，效果还是很漂亮的，不是么？

 

 

 

分享到：
| 开始研究ext,使用心得
评论
2 楼 jsczxy2 2012-08-12  
234369425 写道
擦。。。 。。。
大哥、贴点有用的行不

请根据我的ext分类可以看到更深入的EXT应用
1 楼 234369425 2012-08-09  
擦。。。 。。。
大哥、贴点有用的行不
发表评论

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

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics