→ propc:謝謝^^ 我會試試看... 04/16 08:58
※ 引述《propc (propc)》之銘言:
: 我有很多個layer 1~9 都有分別對應到的連結
: 想要再按一個連結的時候,只顯示對應的該layer
: 語法如下
: <p onclick="MM_showHideLayers('S1','','show','S2','','hide')">S1</p>
: 如果只有兩個layer 很簡單,show一個,hide另一個
: 但有九個layer,要show一格,hide另八個...
: 但是在語法上總不可能把其他的八個layer都寫成hide,
: 不知道有沒有簡單的寫法??
: 謝謝大家...
其實最簡單的寫法就是關 8 開 1,這是概念上不流暢,
但實做上最為簡易的方法,
不過如果能以物件的概念來處理,會更為簡潔。
首先定義一組 layerIndex,和一個參照 index 來做 switch 的函式:
<script language="javascript">
var layerIndex = ['a', 'b', 'c', 'd', 'e'];
function switchLayer (tar) {
if (!tar) return false;
else if (! (tar = tar.getAttribute ('targetLayer'))) return false;
layerLength = layerIndex.length;
for (var i=0; i<layerLength; i++) {
if ((o = document.getElementById ('layer-' + layerIndex[i])) && o.style)
o.style.display = layerIndex[i] != tar ? 'none' : 'block';
}
}
</script>
layerIndex 不用說,只是簡化的 layer id 參照,
switchLayer function 主要是接收傳進來的物件本身(此處會是由 link 傳入)
,再從此物件取出 targetLayer 屬性,判定不關閉的目標 layer 。
接下來的 html 就簡單了,
<a href="#" targetLayer="a" onclick="switchLayer(this);">Layer-a</a>
<a href="#" targetLayer="b" onclick="switchLayer(this);">Layer-b</a>
<a href="#" targetLayer="c" onclick="switchLayer(this);">Layer-c</a>
<a href="#" targetLayer="d" onclick="switchLayer(this);">Layer-d</a>
<a href="#" targetLayer="e" onclick="switchLayer(this);">Layer-e</a>
<div id="layer-a">1</div>
<div id="layer-b">2</div>
<div id="layer-c">3</div>
<div id="layer-d">4</div>
<div id="layer-e">5</div>
你可以試用看看 :)
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 220.139.236.188
※ 編輯: gpmm 來自: 220.139.236.188 (04/16 00:23)