页面导航与javascript的问题

<tr id=1  onclick=changeTableStyle()>
 <td>lllll</td>
 <td><img id=a href=“页面a”>..</img><td>
</tr>
<tr id=2>
...
</tr>
changeTableStyle()这个函数用于点击id=1的tr的时候隐藏或展开id=2的tr id=a 导航到页面a可是当我点击id=a的标签时候却无法导航到页面a 始终是展开或隐藏id=2的tr  该如何解决 谢谢

解决方案 »

  1.   

    例子写的有问题改正下
    <tr id=1 onclick=changeTableStyle()>
     <td>lllll</td>
     <td><a id=a href=“页面a”>..</a><td>
    </tr>
    <tr id=2>
    ...
    </tr>
      

  2.   

    也就是说在changeTableStyle()函数的作用下 a标签不起作用了
      

  3.   

    id命名给数字的话,我记得好像是个不好的习惯,之前我在js找这个id没有找到<html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>无标题页</title>    
        <script language="javascript" type="text/javascript"> 
        function changeTableStyle()
        {
            document.getElementById("tr2").style.backgroundColor="#000";
        }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <table>
            <tr id="tr1" onclick=changeTableStyle()>
                <td>lllll</td>
                <td><a id="a" onclick="javascript:void(0);" href="abc.html">abc</a><td>
            </tr>
            <tr id="tr2">
                <td>xxx</td>
                <td>yyy</td>
            </tr>
        </table>
        </form>
    </body>
    </html>我这边试了下,是可以转到abc.html页面的,只不过跳转前一瞬间,下面的tr2有变黑,也就是说changeTableStyle有执行如果你那边没有跳转,检查changeTableStyle到底做了些什么
      

  4.   

    td是属于tr的,所以你点tr下的任一地方,包括下面的所有td,都会触发你设定的changeTableStyle如果你想单独执行td下的某一事件而又不触发changeTableStyle,所以建议避免在tr上写这个事件这种菜单的折叠效果,你看能不能搜到现成的.我之前做是用ul li嵌套做的.
      

  5.   

    或者把一个独立的div放在id为a的td上,那么点击它,就不会触发tr的onclick事件
      

  6.   

    原来函数changeTableStyle()后面 加了句return false;才导致不能导航新a页面 ，删除return false;后。情况跟你描述一样导航到a页面之前 tr=2依旧要展开 。
      

  7.   

    按你说的把a包含在div里面我试过了 还是不行
      

  8.   

    <tr id=1 onclick=changeTableStyle()>
    换成
    <td onclick=changeTableStyle()>lllll</td>
    前面的已经把原因说的很清楚了，TR包含了你要点击的A，所以触发Onclick后隐藏了那个A，无法跳走，不知你怎么放在DIV里的，可能你还是没有理解原理
      

  9.   

    如果你实在是想用目前这种table,tr,td方式的话,下面这个倒是可以,只不过加的那个div的定位你要定好.当然,还是建议你,换一种实现方式.<html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>无标题页</title>    
        <script language="javascript" type="text/javascript"> 
        function changeTableStyle()
        {
            document.getElementById("tr2").style.backgroundColor="#000";
        }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
       
        <table style="width: 200px; height: 200px;border:1px solid grey;position:absolute;left:0px;top:0px;" border="1" cellpadding="0" cellspacing="0" >
            <tr id="tr1" onclick=changeTableStyle()>
                <td style="width: 100px; height: 100px">111</td>
                <td style="width: 100px; height: 100px">222</td>
            </tr>
            <tr id="tr2">
                <td style="width: 100px; height: 100px">333</td>
                <td style="width: 100px; height: 100px">444</td>
            </tr>
        </table>
        
        <div  style="width: 100px; height: 100px;left:100px;top:0px;position:absolute;border:1px solid red;"><a id="a" href="abc.html" style="display:block;width:100px;height:100px;">abc</a></div>    </form>
    </body>
    </html>