dojox/layout/ContentPane (part II)

簡介

dojox/layout/ContentPane 在下載新內容以更換窗格的內容時，還提供了五個回呼函式，對應五種觸發事件。這五個函式分別是：

onDownloadStart()
onUnload()
onLoad()
onDownloadEnd()
onDownloadError()

當設定 "content" 屬性直接改變內容時，只會觸發並執行 onUnload() 及 onLoad() 兩個函式。而在引入外部的網頁時，則會觸發並依序執行 onDownloadStart()、onUnload()、onLoad() 及 onDownloadEnd() 四個函式，onDownloadError() 只有在下載外部網頁發生錯誤時才會觸發和執行。

其中，onDownloadStart() 這個函式要特別注意，它一定要回傳 (return) 一個字串，根據 dojo 的說明文件，這個字串是用來做為下載訊息之用，如果沒有回傳一個字串，會引發錯誤。切記！切記！

範例

這個範例也是建立兩個按鈕及一個窗格，第一個按鈕直接改變內容，第二個按鈕則從外部引入網頁。執行時會用彈出視窗顯示正在執行的步驟，請同時注意窗格中內容的變化，藉以瞭解函式執行的時機。

CSS

<style>
html{
  width:100%;
  height:100%;
}
 body {
  margin:0 auto;
  width:1000px;
  height:100%;
  padding:0;
  overflow:hidden;
}
#mainCP {
  width:400px;
  height:400px;
  border: 1px solid gray;
}
</style>

CSS 的主要目的只是在把按鈕和窗格移到中間，比較容易觀看及操作。

HTML

<body class="claro">
  
  
  
  
</body>

Script

onUnload() 會在原始內容被清除前執行，此時原始內容的節點 (node) 和 dijit 都還在，如果要針對這些節點和 dijit 做一些事，包括清除事件監聽的機制等等，都可以在此時完成，隨後節點和 dijit 就被清除了。

熊伯的外接硬碟

2015年10月3日星期六