<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
  #div1.active {background:yellow;}
  #div1 div {width:200px; height:200px; background:#ccc; border:1px;
 solid #999;display:none;}
</style>
<script>
window .alond=function ()
{
        var oDiv=document.getElementById('div1');
var aBtn=oDiv.getElementsByTagName('input');
var aBtn=oDiv.getElementsByTagName('div');

for(var i=0; i<aBtn.length; i++)
{
    aBtn[i].index=i;
    aBtn[i].onclick=function ()
{
    for(var i=0; i<aBtn.length;i++)
{
    aBtn[i].className='';
    aDiv[i].style.display='none';
}
     this.className='active';
     aDiv[this.index].style.display='block';
};
};

};
</script>
</head>
<body>
<div id="div1">
           <input  class="active" type="button"  value="教育"/>
           <input type="button"  value="培训"/>
           <input type="button"  value="招生"/>
           <input type="button"  value="出国"/>
           <div style="display:block;">11111</div>
           <div>22222</div>
           <div>33333</div>
           <div>44444</div>
</div>
</body>
</html><div>1111可以显示,其余<div>2.3.4.按纽不能点击选项转换显示.是不是浏览器的问题还是编码有问题?浏览器

解决方案 »

  1.   

    代码问题 :我粗看了看 代码 :
    1.window .alond=》window.onload
    2.var aBtn=oDiv.getElementsByTagName('input');
    var aBtn=oDiv.getElementsByTagName('div');
    一样的名字?
      

  2.   

    这样写就行了:
    window.onload=function () {
        var oDiv=document.getElementById('div1');
        var aBtn=oDiv.getElementsByTagName('input');
        var aDiv=oDiv.getElementsByTagName('div');    for(var i=0; i<aBtn.length; i++) {
            aBtn[i].index=i;
            aBtn[i].onclick=function () {
                for(var i=0; i<aBtn.length;i++) {
                    aBtn[i].className='';
                    aDiv[i].style.display='none';
                }
                 this.className='active';
                 aDiv[this.index].style.display='block';
            };
        };
    };
      

  3.   

    ls说的都对
    有三处需要修改:
    1、window.alond 改为:window.onload
    2、var aBtn=oDiv.getElementsByTagName('div');
       改为:
       var aDiv = oDiv.getElementsByTagName('div');
    3、#div1 div {width:200px; height:200px; background:#ccc; border:1px;
       solid #999;display:none;}
       改为:
       #div1 div {width:200px; height:200px; background:#ccc; border:1px solid #999;display:none;}
      

  4.   


    对.是一样的名字.这是听老师讲课时抄下的编码.还就是漏掉了一个onload中的n字母。
      

  5.   

    也许这样就没有问题吧<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style>
      #div1.active {background:yellow;}
      #div1 div {width:200px; height:200px; background:#ccc; border:1px;
     solid #999;display:none;}
    </style>
    <script>
    window.onload=function ()
    {
            var oDiv=document.getElementById('div1');
    var aBtn=oDiv.getElementsByTagName('input');
    var aDiv=oDiv.getElementsByTagName('div'); for(var i=0; i<aBtn.length; i++)
    {
    aBtn[i].index=i;
    aBtn[i].onclick=function ()
    {
    for(var i=0; i<aBtn.length;i++)
    {
    aBtn[i].className='';
    aDiv[i].style.display='none';
    }
    this.className='active';
    aDiv[this.index].style.display='block';
    };
    };};
    </script>
    </head>
    <body>
    <div id="div1">
               <input  class="active" type="button"  value="教育"/>
               <input type="button"  value="培训"/>
               <input type="button"  value="招生"/>
               <input type="button"  value="出国"/>
               <div style="display:block;">11111</div>
               <div>22222</div>
               <div>33333</div>
               <div>44444</div>
    </div>
    </body>
    </html>