注册 登录
编程论坛 → JavaScript论坛

[问题求助] style为空或不是对象

mercury9111 发布于 2010-03-10 10:51， 2907 次点击
<script type="text/javascript">
//m选项卡数目
//n当前选项卡编号
function setTab(m,n){
var menu=document.getElementById("tab"+m).getElementsByTagName("li");   //获取ID为tab+m标签下的li标签
var showdiv=document.getElementById("tablist"+m).getElementsByTagName("div");   //获取ID为tablist+m标签下的div标签
for(i=0;i<menu.length-1;i++)
{
  menu[i].className=i==n?"now":"";   //如果i=n;那么menu[i].classname为now
  showdiv[i].style.display=i==n?"block":"none";   //如果如果i=n;那么showdiv[i].style.display为block"
}
}
</script>

开始的时候总是报错，“style为空或不是对象”，请朋友帮忙调了一下依然报错，请大家帮忙看下问题在哪？请多多指教，谢谢。
4 回复
#2
aspic2010-03-10 11:01
html也贴出来
#3
mercury91112010-03-10 11:14
好的，谢谢。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
    <!--
#tab1 ,#tab2{width:435px;border:1px #cfedff solid;border-bottom:0; background-color:#FFFFFF; padding-left:0px;}
#tab1 ul ,#tab2 ul{margin:0;padding:0;}
#tab1 li,#tab2 li{float:left; height:22px;line-height:22px;text-align:center; border-left:1px solid #C0C2DF; padding:none; border-bottom:1px solid #C0C2DF; cursor:default;}
#tab1 li img{vertical-align:middle; border:none; padding:none;}
#tab1 li.now,#tab2 li.now{color:#5299c4;background:#fff;}
.tablist{width:435px; padding-left:1px;font-size:14px;line-height:18px;border:1px #cfedff solid;border-top:0;display:none;}
.block{display:block;}
    -->
</style>
</head>
<script type="text/javascript">
//m选项卡数目
//n当前选项卡编号
function setTab(m,n){
 var menu=document.getElementById("tab"+m).getElementsByTagName("li");   //获取ID为tab+m标签下的li标签
 var showdiv=document.getElementById("tablist"+m).getElementsByTagName("div");   //获取ID为tablist+m标签下的div标签
 for(i=0;i<menu.length-1;i++)
 {
  menu[i].className=i==n?"now":"";   //如果i=n;那么menu[i].classname为now
  showdiv[i].style.display=i==n?"block":"none";   //如果如果i=n;那么showdiv[i].style.display为block"
 }
}
</script>

<body>
 <div id="tab1">
        <ul>
            <li onmouseover="setTab(1,0)" class="now" style="background-color:#FFFFFF; width:105px;">第一页</li>
            <li onmouseover="setTab(1,0)" class="now" style="background-color:#FFFFFF; width:105px;">第二页</li>
            <li onmouseover="setTab(1,0)" class="now" style="background-color:#FFFFFF; width:105px;">第三页</li>
        <li onmouseover="setTab(1,0)" class="now" style="background-color:#FFFFFF; width:105px;">第四页</a></li>
        </ul>
    </div>
 
 <div id="tablist1">
        <div class="tablist block" style="background-color:#FFFFFF;">
        <iframe border="0" frameborder="no" marginwidth="0" marginheight="0" scrolling="no" hspace="0" vspace="0" src="1"></iframe>
        </div>
        <div class="tablist" style="background-color:#FFFFFF;">
        <iframe border="0" frameborder="no" marginwidth="0" marginheight="0" scrolling="no" hspace="0" vspace="0" src="2"></iframe>
        </div>
        <div class="tablist" style="background-color:#FFFFFF;">
         <iframe border="0" frameborder="no" marginwidth="0" marginheight="0" scrolling="no" hspace="0" vspace="0" src="3"></iframe>
        </div>
     <div class="tablist" style="background-color:#FFFFFF;">
         <iframe border="0" frameborder="no" marginwidth="0" marginheight="0" scrolling="no" hspace="0" vspace="0" src="4"></iframe>
        </div>
    </div>
 </div>
 </body>
 </html>
#4
aspic2010-03-10 14:50
程序代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www. http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
    <!--
#tab1 ,#tab2{width:435px;border:1px #cfedff solid;border-bottom:0; background-color:#FFFFFF; padding-left:0px;}
#tab1 ul ,#tab2 ul{margin:0;padding:0;}
#tab1 li,#tab2 li{float:left; height:22px;line-height:22px;text-align:center; border-left:1px solid #C0C2DF; padding:none; border-bottom:1px solid #C0C2DF;
cursor:default;}
#tab1 li img{vertical-align:middle; border:none; padding:none;}
#tab1 li.now,#tab2 li.now{color:#5299c4;background:#fff;}
.tablist{width:435px; padding-left:1px;font-size:14px;line-height:18px;border:1px #cfedff solid;border-top:0;display:none;}
.block{display:block;}
    -->
</style>
</head>
<script type="text/javascript">
//m选项卡数目
//n当前选项卡编号
function setTab(n){
    var menu=document.getElementById("tab1").getElementsByTagName("li");   //获取ID为tab+m标签下的li标签
    var showdiv=document.getElementById("tablist1").getElementsByTagName("div");   //获取ID为tablist+m标签下的div标签
    for(i=0;i<menu.length;i++){
          menu[i].className = (i==n) ? "now" : "";   //如果i=n;那么menu[i].classname为now
          showdiv[i].style.display = (i==n) ? "block" : "none";   //如果如果i=n;那么showdiv[i].style.display为block"
    }
}
</script>

<body>
<div id="tab1">
    <ul>
        <li onmouseover="setTab(0)" class="now" style="background-color:#FFFFFF; width:105px;">第一页</li>
        <li onmouseover="setTab(1)" style="background-color:#FFFFFF; width:105px;">第二页</li>
        <li onmouseover="setTab(2)" style="background-color:#FFFFFF; width:105px;">第三页</li>
        <li onmouseover="setTab(3)" style="background-color:#FFFFFF; width:105px;">第四页</li>
        </ul>
</div>
<div id="tablist1">
    <div class="tablist block" style="background-color:#FFFFFF;">1</div>
        <div class="tablist" style="background-color:#FFFFFF;">2</div>
        <div class="tablist" style="background-color:#FFFFFF;">3</div>
    <div class="tablist" style="background-color:#FFFFFF;">4</div>
</div>
</body>
</html>
#5
mercury91112010-03-10 15:47
收到，太感谢了
1
©2025, BC-CN.NET
电脑版