点击更换DIV层Class的JS ，但是有BUG，求指教

代码不可以浏览效果，真不方便
效果请查看 http://bbs.blueidea.com/thread-2897021-1-1.html

解决方案 »

  1.   

    不用这么麻烦把
    onclick="changeBg('a','aaa')"、onclick="changeBg('b','aaa')"
    改成
    onclick="changeBg(this)"
    ///
    function changeBg(obj)
             {  
                    if(obj.className=='aaagray')  obj.className='aaared';
                    else  obj.className='aaagray';          } 
      

  2.   

    可以，点击是一个事件，可以通过event.srcElement获取到点击的控件，直接改变控件的Class
    function changeBg(id,str){ 
    var divTag = event.srcElement;
    if(typeof divTag=="object")
    {
    if(divTag.id=="a"){
    divTag.className=str +"gray";}
    else{
    divTag.className=str +"red";
    }
    } 
              }
      

  3.   

    这么麻烦干嘛
    <!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>
    </head>
    <STYLE type=text/css>
    .aaagray{
        background:#ccc;
        width:150px;
        height:25px;
        cursor:hand;
        }
    .aaared{
        background:red;
        width:150px;
        height:25px;
        cursor:hand;
        }
    </style>
    <body>
    <script type="text/javascript">
    function changeBg(obj)
    {  
    if(obj.className=='aaagray')
    obj.className="aaared"
    else
       obj.className= "aaagray"
    } 
              
    </script>
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="12%"><div id="a" class="aaared" onclick="changeBg(this)"></div></td>
        <td width="11%"><div id="b" class="aaagray" onclick="changeBg(this)"></div></td>
        <td width="74%">&nbsp;</td>
        <td width="3%">&nbsp;</td>
      </tr>
    </table>
    </body>
    </html>