EXTJS4自学手册——EXT基本方法、属性(onReady、define、create)

1.Ext.onReady

说明:onReady内的语句块会在页面上下文加载后再执行

例子:

复制代码
<html> <head> <title>Index</title> <link href="http://www.cnblogs.com/Scripts/ext-4.0.7-gpl/ext-4.0.7-gpl/resources/css/ext-all.css" rel="stylesheet"type="text/css"/> <script src="http://www.cnblogs.com/Scripts/ext-4.0.7-gpl/ext-4.0.7-gpl/ext-all-dev.js"type="text/javascript"></script> <script src="http://www.cnblogs.com/Scripts/App/Data/books.js"type="text/javascript"></script> <script type="text/javascript"> Ext.onReady(function() { //获取页面元素,元素ID为“onReady”varinput =Ext.get("onReady"); Ext.Msg.alert("隐藏控件内容",input.dom.value);  }); </script> </head> <body> <div id="Ext4-Panel"> <input type="hidden"value="页面已经加载"id = "onReady"/> </div> </body> </html>
复制代码

执行结果:

如果代码段没有放入Ext.onReady中,会报错:

 

2.Ext.define

说明:创建类,可以继承其他类,也可以被继承

例子1:

复制代码
<script type="text/javascript"> Ext.onReady(function() { //创建一个类,类名:TextClass,具有两个属性:A、BExt.define('TextClass', { A: 'a', B: 'b' }); //实例化类vartextClass =newTextClass(); //输出属性名Ext.Msg.alert('类属性', textClass.A +""+textClass.B); }); </script>
复制代码

执行结果:

例子2:

复制代码
<script type="text/javascript"> Ext.onReady(function() { //创建一个类,类名:TextClass,具有两个属性:A、BExt.define('TextClass', { A: 'a', B: 'b' }); //创建一个类,继承TextClassExt.define("TextClass2", { extend: 'TextClass',//继承TextClassC: 'c'//TextClass2特有的属性}) vartextClass2 =newTextClass2(); Ext.Msg.alert("TextClass2属性",textClass2.A+""+textClass2.B+""+textClass2.C) }); </script>
复制代码

执行结果:

 

3.Ext.create

说明:实例化类,在EXTJS4中建议用create方法实例化类

复制代码
<script type="text/javascript"> Ext.onReady(function() { //创建一个类,类名:TextClass,具有两个属性:A、BExt.define('TextClass', { A: 'a', B: 'b' });
vartextClass =Ext.create("TextClass")
Ext.Msg.alert(
'textClass属性', textClass.A +''+textClass.B ) }); </script>
复制代码

执行结果:

原文地址:https://www.cnblogs.com/yanni/p/3294709.html