Extjs学习笔记(2012-01-18)
首先下载 extjs
http://www.sencha.com/products/extjs/download
目前最新版本4.07,大概40M
解压后 竟然有150M,当前这是完全版,里面包含实例什么的。
我们只要 取出核心内容就可以了。
extjs4/resources;//CSS、图片
extjs4/ext-all-debug.js;//未压缩的extjs核心库(2.4M)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>study</title><link href="extjs4/resources/css/ext-all.css" rel="stylesheet" /><script type="text/javascript" src="extjs4/ext-all-debug.js"></script><script type="text/javascript">Ext.onReady(function(){ // 当页面下载完毕时执行,类型与jQuery $(document).ready(); //调用Ext的信息盒子方法之警告框 /* param1(String):警告框标题,param2(String):提示信息, param3(fn):回调函数 */Ext.MessageBox.alert('Message','您确定提交吗?',t);});</script></head><body></body></html><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>extjs</title><link href="extjs4/resources/css/ext-all.css" rel="stylesheet" /><script type="text/javascript" src="extjs4/ext-all-debug.js"></script><script type="text/javascript" src="extjs4/locale/ext-lang-zh_CN.js"></script><script type="text/javascript">Ext.require([//require 预先加载组建 提高加载效率'Ext.window.MessageBox']);Ext.onReady(function(){var Msg = function(){alert(arguments[0]);}/*Ext.Msg.alert('Message','hello world!',function(){Msg('hello world');});*//*Ext.Msg.confirm('Message','Are you ready?',function(btn){if( btn == 'yes' )Msg('hello world');});*//*Ext.Msg.prompt('Message','Are you ready?',function(btn,text){if(btn=='ok')alert(text);elsealert('no');});*//*var params = {title:'Message',msg:'Are you ready ?',buttons:Ext.Msg.YESNOCANCEL, // YES,NO,YESNOicon: Ext.Msg.QUESTION,fn:function(btn){alert(btn);} };Ext.Msg.show(params);*/Ext.get('mb9').on('click',function(){ Ext.MessageBox.show({ title: 'Icon Support', msg: 'Here is a message with an icon!', buttons: Ext.MessageBox.OK, animateTarget: 'mb9', //fn: showResult, icon: Ext.Msg.WARNING });});console.log(Ext.get('mb9').dom);});</script></head><body><button id="mb9">show</button></body></html>