切换标签页Firefox下正常,IE下第一个标签页内容无法切换出来

mercury1231 2009-01-03 10:35:16
做了一个切换标签页的东西,可是不知道为什么Firefox下面运行的很好,但是IE里第一个标签页内容切换不出来(首次加载正常)?
是不是IE对这个支持有什么不对的地方?有一个地方嵌套了HTML代码,里面含有div,table等元素,不知道有没有影响?


<div id="product-details" class="product-collateral">
<script type="text/javascript">
function showTab(tabHeadId,tabContentId)
{
var tabDiv = document.getElementById("product-details-contents");
var taContents = tabDiv.childNodes;

for(i=0; i<taContents.length; i++) {
if(taContents[i].id!=null && taContents[i].className == 'collateral-box') {
taContents[i].style.display = 'none';
}
}

document.getElementById(tabContentId).style.display = '';
//alert(document.getElementById(tabContentId).style.display);

var tabHeads = document.getElementById('product-details-tabs').getElementsByTagName('span');
for(i=0; i<tabHeads.length; i++) {
tabHeads[i].className='tab';
}

document.getElementById(tabHeadId).className='curtab';
document.getElementById(tabHeadId).blur();
}
</script>

<div id="product-details-tabs" class="tabs">
<span id="description-tab" class="curtab" onclick="javascript:showTab('description-tab', 'description');">Description</span>
<span id="specification-tab" class="tab" onclick="javascript:showTab('specification-tab', 'specification');">Specification</span>
<span id="warranty-tab" class="tab" onclick="javascript:showTab('warranty-tab', 'warranty');">Warranty</span>

<span id="review-tab" class="tab" onclick="javascript:showTab('review-tab', 'review');">Reviews</span>
</div>
<div id="product-details-contents" class="collateral-boxes">
<div id="description" class="collateral-box" style="display:block">
test message here!
<div class="product-specs">
Re-defining the perception of advanced mobile phones… the HTC Touch Diamond™ signals a giant leap forward in combining hi-tech prowess with intuitive usability and exhilarating design.<br />
<br />
Featuring a sharp 2.8-inch touch screen housed within a stunning formation of brushed metal and flawless faceted edges, the HTC Touch Diamond is as beautiful to behold as it is to use.<br />
</div>
</div>
<div id="specification" class="collateral-box" style="display:none">
<div class="collateral-box attribute-specs">

<table cellspacing="0" class="data-table" id="product-attribute-specs-table">
<tr>
<td class="label">Model</td>
<td class="data">HTC Touch Diamond</td>
</tr>
<tr>
<td class="label">In Depth</td>

<td class="data">Re-defining the perception of advanced mobile phones… the HTC Touch Diamond™ signals a giant leap forward in combining hi-tech prowess with intuitive usability and exhilarating design.
</td>
</tr>
<tr>
<td class="label">Band</td>
<td class="data">GSM 850, GSM 900, GSM 1800, GSM 1900, HSDPA 2100</td>
</tr>
<tr>

<td class="label">Dimensions</td>
<td class="data">102 mm (L) X 51 mm (W) X 11.35 mm (T)</td>
</tr>
<tr>
<td class="label">Feature</td>
<td class="data">Alarm, Antenna Internal</td>
</tr>

</table>
<script type="text/javascript">decorateTable('product-attribute-specs-table')</script>
</div>
</div>
<div id="warranty" class="collateral-box" style="display:none">
No warrant information currently available.
</div>
<div id="review" class="collateral-box" style="display:none">
No customer reviews posted yet.
</div>

</div>
</div>

...全文
134 1 打赏 收藏 转发到动态 举报
写回复
用AI写文章
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
shumier 2009-01-04
  • 打赏
  • 举报
回复
少css,测不出效果。

61,115

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧