作者在 2008-03-19 16:25:34 发布以下内容
今天看了一天的Ext,没有发现有比较系统的教材...每个组件的定义,里面的属性,简单的例子,有些倒是讲到了,但是有些没有。API文档也只是一个一个的讲各个组件的属性和方法。这样看比较头大,不知道有没有一本好点的书来看看。
写了一个window,算是今天学到的吧。不过里面的信息背景是白色的,想弄得跟window背景的蓝色一样,不知道怎么弄...
window.html:
然后是my_window.js:
写了一个window,算是今天学到的吧。不过里面的信息背景是白色的,想弄得跟window背景的蓝色一样,不知道怎么弄...
window.html:
<!
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><
html><
head><
meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"><
title>Window</title><
link rel="stylesheet" type="text/css" href="exts/ext-all.css" /><
script type="text/javascript" src="exts/ext-base.js" ></script><
script type="text/javascript" src="exts/ext-all.js" ></script><
script type="text/javascript" src="js/my_window.js" ></script></
head><
body><
input type="button" id="b1" value="Click" /><br/><
div id="window-win"> <div id="content"> <div id="msg-cancel"></div> </div></
div></
body></
html>然后是my_window.js:
Ext.onReady(
function(){var
b1 = Ext.get('b1');b1.on(
'click',function(){var
win = new Ext.Window({ el:'window-win',width:300,
height:280,
closeAction:
'close',title:
'Ext window',items:[
{ html:'This is just a message.' }],buttons:[
{ text:'Alert',handler:
function(){ Ext.Msg.alert('Status', 'It is OK!'); }}
,{ text:'Confirm',handler:
function(){ Ext.Msg.confirm('Confirm', 'Choose Yes or No?', function(btn){ alert('You clicked ' + btn); }); }}
,{ text:'Prompt',handler:
function(){ Ext.Msg.prompt('Prompt', 'Your name?', function(btn, text){if
(btn == 'ok') { alert('I got your name,' + text + '!'); }}
); }}
,{ text:'Show',handler:
function(){ Ext.Msg.show({ multiline:true,title:
'Cancel',msg:
'Really want to cancel?',buttons:Ext.Msg.YESNOCANCEL,
animEl:
'msg-cancel',fn:
function(btn){if
(btn == 'yes') {alert('OK! Canceled!');}if
(btn == 'no') {alert("You don't cancel!");}if
(btn == 'cancel') {alert('cancel!');}}
}
); }}
] });win.show();
});}
); 刚开始不太习惯Ext的这种语法,现在好点了。继续学习...