Dreamweaver CS3中整合了Spry功能我們都知道,Spry具有對XML資料處理的功能我們也見識過,不過對於Spry的詳細區域功能似乎很少見。
Spry詳細區域有點類似新聞系統中的新聞列表頁和主詳細頁的功能。例如我們看新聞時,其中有一個頁面只會顯示所有新聞的標題,當對該標題感興趣時可以單擊該標題打開一個新的網頁,就可以查看到該新聞的全部內容了。那麼顯示所有標題清單的頁面我們稱為“主頁”,而顯示具體新聞內容的頁面稱為“詳細頁”。
很顯然,這個主詳細頁最起碼得是兩頁。而我們使用的Spry詳細區域可以在一張網頁上顯示,而且是無刷新的。
一,新建網頁,綁定Spry XML 資料集
在網頁中開啟【插入】面板,點選【Spry】標籤下的【Spry XML 資料集】
二,選擇XML資料來源
彈出【Spry XML 資料集】對話框,【XML來源】可以是本地目錄下的XML數據,也可以是跨域的遠端XML資料。
點選【取得架構】按鈕在【行元素】列錶框中選擇XML資料中有價值的重複元素,這裡就是選擇的「item」元素(<>標誌右上角有+號表示循環的多個)。
PS 如果製作純粹的XML資料聚合的頁面,也可以選擇【停用XML資料快取】,並選擇自動刷新資料的時間以自動取得遠端資料同步。
三,插入Spry表,顯示Spry XML資料在頁面
點選【插入】面板【Spry】標籤下的【Spry 表】按鈕,彈出的對話方塊中將不需要顯示的【列】進行刪除。
很重要的一個操作就是一定要選擇單擊行時將使用“更新”詳細區域。
【確定】插入Spry表,提示需要插入Spry區域。因為所有的Spry XML 資料必須在Spry區域中才能顯示。
四,插入Spry詳細區域
首先,滑鼠遊標停留在已經插入在頁面中的「Spry表」之後,繼續點選【插入】面板【Spry】標籤下的【Spry 區域】按鈕。
彈出的對話方塊中【類型】一定要選擇為「詳細區域」才表示目前是Spry詳細區域。
五,將「詳細內容」插入Spry詳細區域
滑鼠遊標停留在Spry詳細區域內,打開【綁定】面板,選擇「description」元素【插入】到Spry詳細區域中。
儲存網頁會提示我們儲存Spry效果文件,記得上傳的時候要連同這些文件一起上傳。
六,預覽效果
跨網域顯示遠端XML數據,同時按一下每行標題都能在目前頁無刷新開啟內容查看,甚好。