ExtJS4教程—-Ext.onReady、Ext.define、Ext.create基礎方法

最後更新：2014-09-19 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

標籤：style blog http color io java ar strong div

Ext.onReady

說明：onReady內的語句塊會在頁面上下文載入後再執行

例子：

<html>

<head>

<title>Index</title>

Ext.onReady(function () {

//擷取頁面元素，元素ID為“onReady”

var input = Ext.get("onReady");

Ext.Msg.alert("隱藏控制項內容",input.dom.value);

});

</script>

</head>

<body>

</div>

</body>

</html>

執行結果：

如果程式碼片段沒有放入Ext.onReady中，會報錯：

Ext.define

說明：建立類，可以繼承其他類，也可以被繼承

例子1：

Ext.onReady(function () {

//建立一個類，類名：TextClass，具有兩個屬性：A、B

Ext.define(‘TextClass‘, {

A: ‘a‘,

B: ‘b‘

});

//執行個體化類

var textClass = new TextClass();

//輸出屬性名稱

Ext.Msg.alert(‘類屬性‘, textClass.A + " " + textClass.B);

});

</script>

執行結果：

例子2：

Ext.onReady(function () {

//建立一個類，類名：TextClass，具有兩個屬性：A、B

Ext.define(‘TextClass‘, {

A: ‘a‘,

B: ‘b‘

});

//建立一個類，繼承TextClass

Ext.define("TextClass2", {

extend: ‘TextClass‘,//繼承TextClass

C: ‘c‘//TextClass2特有的屬性

})

var textClass2 = new TextClass2();

Ext.Msg.alert("TextClass2屬性",textClass2.A+ " "+textClass2.B+ " "+textClass2.C)

});

</script>

執行結果：

3.Ext.create

說明：執行個體化類，在EXTJS4中建議用create方法執行個體化類

Ext.onReady(function () {

//建立一個類，類名：TextClass，具有兩個屬性：A、B

Ext.define(‘TextClass‘, {

A: ‘a‘,

B: ‘b‘

});

var textClass = Ext.create("TextClass")

Ext.Msg.alert(‘textClass屬性‘, textClass.A + ‘ ‘ + textClass.B )

});

</script>

執行結果：

ExtJS4教程—-Ext.onReady、Ext.define、Ext.create基礎方法（轉）

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More

ExtJS4教程—-Ext.onReady、Ext.define、Ext.create基礎方法

聯繫我們

A Free Trial That Lets You Build Big!

Sales Support

After-Sales Support