EXT 3.x 使用详解之Ext.Window
这个是最基础的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>
把这段贴进去,就可以看到效果了,恩,效果还是很漂亮的,不是么?
页:
[1]