改变导航的背景色，高手来看下啊，很急的


<td  width="0" height="22" align="center" bgcolor="#47698E" style="padding: 0px 8px 0px 8px;color: #fff;">
      <asp:LinkButton ID="lnkToday" runat="server" OnClick="lnkToday_Click">今日</asp:LinkButton>
</td>
<td  align="center" style="padding: 0px 8px 0px 8px;">
      <asp:LinkButton ID="lnkYesterday" runat="server" OnClick="lnkYesterday_Click">昨日</asp:LinkButton>
</td>
      <td  align="center" style="padding: 0px 8px 0px 8px;">
<asp:LinkButton ID="lnkSeven" runat="server" OnClick="lnkSeven_Click">最近7天</asp:LinkButton>
      </td>
<td  align="center" style="padding: 0px 8px 0px 8px;">
      <asp:LinkButton ID="lnkWeek" runat="server" OnClick="lnkWeek_Click">本周</asp:LinkButton>
</td>
<td  align="center" style="padding: 0px 8px 0px 8px;">
      <asp:LinkButton ID="lnkThirty" runat="server" OnClick="lnkThirty_Click">最近30天</asp:LinkButton>
</td>
每个td里都包含一个LinkButton，我想点击某个LinkButton让包含它的td改变背景色，默认第一个是选中的~高手帮帮忙啊

解决方案 »

  1.   

    javascript不会呀，麻烦您能写个全的吗
      

  2.   

    参考:<body>
    <style>
    td{padding: 0px 8px 0px 8px;height:22px;}
    .nav_click{color: #fff;background:#47698E}
    </style>
    <table border="1" width="100%" cellspacing="0" cellpadding="0" id=inf><tr>
    <td  align="center"class=nav_click>
          <asp:LinkButton ID="lnkToday" runat="server" OnClick="lnkToday_Click">今日</asp:LinkButton>
    </td>
    <td  align="center">
          <asp:LinkButton ID="lnkYesterday" runat="server" OnClick="lnkYesterday_Click">昨日</asp:LinkButton>
    </td>
    <td  align="center">
          <asp:LinkButton ID="lnkSeven" runat="server" OnClick="lnkSeven_Click">最近7天</asp:LinkButton>
          </td>
    <td  align="center">
          <asp:LinkButton ID="lnkWeek" runat="server" OnClick="lnkWeek_Click">本周</asp:LinkButton>
    </td>
    <td  align="center">
          <asp:LinkButton ID="lnkThirty" runat="server" OnClick="lnkThirty_Click">最近30天</asp:LinkButton>
    </td>
    </tr></table>
    <script language="javascript">
    <!--
    var obj=document.getElementById("inf").cells;
    for (var i=0;i<obj.length;i++)
    obj[i].onclick=function(){changBG(this)}
    function changBG(_this){
    for (var i=0;i<obj.length;i++)obj[i].className=""
    _this.className="nav_click"
    }
    //-->
    </script></body>
      

  3.   

    给每个td起个类名，然后在css里面更改对应类名样式
      

  4.   


    var obj=document.getElementById("inf").cells;
    怎么说缺少对象啊
      

  5.   

    try:var obj=document.getElementById("inf").cells;放在
    <table border="1" width="100%" cellspacing="0" cellpadding="0" id=inf>
    ....
    </table>
    之后
      

  6.   

    or:<script language="javascript">
    <!--
    onload=function(){
    var obj=document.getElementById("inf").cells;
    for (var i=0;i<obj.length;i++)
        obj[i].onclick=function(){changBG(obj,this)}
    }
    function changBG(obj,_this){
        for (var i=0;i<obj.length;i++)obj[i].className=""
        _this.className="nav_click"
    }
    //-->
    </script>
      

  7.   

    test:<body>
    <style>
    td{padding: 0px 8px 0px 8px;height:22px;}
    .nav_click{color: #fff;background:#47698E}
    </style>
    <table border="1" width="100%" cellspacing="0" cellpadding="0" id=inf><tr>
        <td  align="center"class=nav_click>
              <asp:LinkButton ID="lnkToday" runat="server" OnClick="lnkToday_Click">今日</asp:LinkButton>
        </td>
        <td  align="center">
              <asp:LinkButton ID="lnkYesterday" runat="server" OnClick="lnkYesterday_Click">昨日</asp:LinkButton>
        </td>
        <td  align="center">
              <asp:LinkButton ID="lnkSeven" runat="server" OnClick="lnkSeven_Click">最近7天</asp:LinkButton>
              </td>
        <td  align="center">
              <asp:LinkButton ID="lnkWeek" runat="server" OnClick="lnkWeek_Click">本周</asp:LinkButton>
        </td>
        <td  align="center">
              <asp:LinkButton ID="lnkThirty" runat="server" OnClick="lnkThirty_Click">最近30天</asp:LinkButton>
        </td>
    </tr></table>
    <script language="javascript">
    <!--
    function GetCookie(Name) {//读Cookie中Name的值
    var search = Name + "="
    var Cookie =document.cookie;
    if (Cookie.length <= 0 || Cookie.indexOf(search)==-1)return 0;// cookie 不存在 或 'openid' 不存在,返回 0
    else{
    var tmp= Cookie.split(search)[1].split(";")[0]
    return unescape(tmp)
    }
    }
    function SetCookie(id){//写Cookie
    document.cookie="opened="+escape(id)
    }
    onload=function(){
    var obj=document.getElementById("inf").cells;
    var tmp=GetCookie('opened');
    //'opened'有效，设定对应的样式
    changBG(obj,tmp)

    for (var i=0;i<obj.length;i++)
        (function(k){obj[k].onclick=function(){changBG(obj,k)};})(i)
    }
    function changBG(obj,k){
        for (var i=0;i<obj.length;i++)obj[i].className=""
        obj[k].className="nav_click"
        SetCookie(k)
    }//-->
    </script></body>
      

  8.   

    JQUERY  <style type="text/css">
      .bg
      {
    background-color:#47698e;
    color:#fff;
      }
      </style>  <script language="javascript">
      $(function(){
      $("td").click(function(){
      $("td").removeClass("bg");
      $(this).addClass("bg");
      });
      });
      </script>