zoukankan      html  css  js  c++  java
  • table在 点击线条颜色

    效果图:



    <html>
     <head>
      <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
      <title>无标题文档</title>
      <script language="javascript" type="text/javascript">
    function tagscheck(a) {
        var lng = document.getElementsByTagName("tr").length;
        for (i = 0; i < lng; i++) {
            var temp = document.getElementsByTagName("tr")[i];
            if (a == temp) {
                //选中的标签样式
                temp.style.background = "#ccc";
    
            } else {
                //恢复原状
                temp.style.background = "";
            }
    
        }
    
    }
     
    </script>
     </head>
     <body>
      <table width="100%" border="1" cellpadding="2" cellspacing="0">
       <tbody>
        <tr>
         <td bgcolor="#006600">dd </td>
         <td bgcolor="#006600"> dd</td>
         <td bgcolor="#006600">dd </td>
        </tr>
        <tr onclick="tagscheck(this);">
         <td> 2</td>
         <td>3 </td>
         <td>4 </td>
        </tr>
        <tr onclick="tagscheck(this);">
         <td> 45</td>
         <td>456 </td>
         <td>46 </td>
        </tr>
        <tr onclick="tagscheck(this);">
         <td> 3</td>
         <td>3 </td>
         <td>45 </td>
        </tr>
        <tr onclick="tagscheck(this);">
         <td> 67</td>
         <td>7 </td>
         <td>s </td>
        </tr>
        <tr onclick="tagscheck(this);">
         <td>d </td>
         <td> a</td>
         <td>s </td>
        </tr>
        <tr onclick="tagscheck(this);">
         <td> s</td>
         <td> d</td>
         <td>s </td>
        </tr>
       </tbody>
      </table>  
     </body>
    </html>


    參考资料

    http://zhidao.baidu.com/link?

    url=txLVh18itJdgSl-9mIO7YlnaKjmCVLiEhcAaAK5dEaBwASm1QltNH52mcs3BNLMU_Mr3sr0lcrrocXFmuaHGu_

    版权声明:本文博客原创文章,博客,未经同意,不得转载。

  • 相关阅读:
    ListView自定义滑动条
    使用天天模拟器开发Android应用
    自定义对话框
    显示下载进度
    PullToRefresh的使用
    Cookie
    Servlet
    HTTP
    svn
    转:MAVEN常用命令
  • 原文地址:https://www.cnblogs.com/blfshiye/p/4752388.html
Copyright © 2011-2022 走看看