因为要在前台做切换页面的功能,为了方便,所以打算将所有的 div 都用同样的 name,然后先在 getElementsByName 取得所有的 div 后隐藏,然后在显示特定的 div。所以写了如下程序:
<SCRIPT LANGUAGE="JavaScript">
<!--
function ShowSpan(objName)
{
var objarr = document.getElementsByName("spn");
for (var i =0;i < objarr.length ;i++ )
{
objarr[i].style.display = "none";
}
var obj = document.getElementById(objName);
obj.style.display = "block";
}
//-->
</SCRIPT>
<input type="button" name="Show1" value="Show span 001" onclick="ShowSpan('spn1');">
<input type="button" name="Show1" value="Show span 002" onclick="ShowSpan('spn2');">
<input type="button" name="Show1" value="Show span 003" onclick="ShowSpan('spn3');">
<input type="button" name="Show1" value="Show span 004" onclick="ShowSpan('spn4');">
<input type="button" name="Show1" value="Show span 005" onclick="ShowSpan('spn5');"><br >
<div id="spn1" name="spn" style="display:">span 001</div>
<div id="spn2" name="spn" style="display:none;">span 002</div>
<div id="spn3" name="spn" style="display:none;">span 003</div>
<div id="spn4" name="spn" style="display:none;">span 004</div>
<div id="spn5" name="spn" style="display:none;">span 005</div>
在 Firefox 上,一切如预期的,但是后来在 IE 上测试才发现,要隐藏的都隐藏不起来……
在网络上找了一下才发现,原来 IE 下,getElementsByName 只对表单的物件有作用。
最后在这边找到有人写了个 iefix 的函数,主要是先用 tag 去找物件,然后再判断 name 是不是一样,一样的话就塞到阵列中再回传。
function getElementsByName_iefix(tag, name) {
var elem = document.getElementsByTagName(tag);
var arr = new Array();
for(i = 0,iarr = 0; i < elem.length; i++) {
att = elem[i].getAttribute("name");
if(att == name) {
arr[iarr] = elem[i];
iarr++;
}
}
return arr;
}
cftea 将原繁体转化为简体。