javascript - 如果使用 Jquery 单击 td,则为表内的所有 tr 元素着色

标签 javascript jquery html

当它从任何子 td 元素调用时,我有一个表试图使用 jQuery 为所有 tr 元素着色。这是我的代码。

<table>
  <tr style="color: rgb(31, 73, 125); background-color: #eaeaea;"><td style="padding-left: 5px;"><a style="cursor: pointer;" onclick="download_excel(this,'BL8','ATR','AWFR')">ATR-ADM-BLCMA8-CHN18-03-01-D</a></td><td>14</td><td>0</td><td>56</td><td>56</td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td></tr>
  <tr style="color: rgb(31, 73, 125); background-color: #eaeaea;"><td style="padding-left: 5px;"><a style="cursor: pointer;" onclick="download_excel(this,'BL8','ATR','AWFR')">ATR-ADM-BLCMA8-CHN18-03-01-D</a></td><td>14</td><td>0</td><td>56</td><td>56</td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td></tr>
  <tr style="color: rgb(31, 73, 125); background-color: #eaeaea;"><td style="padding-left: 5px;"><a style="cursor: pointer;" onclick="download_excel(this,'BL8','ATR','AWFR')">ATR-ADM-BLCMA8-CHN18-03-01-D</a></td><td>14</td><td>0</td><td>56</td><td>56</td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td></tr>
</table>
<script>
  function download_excel(element,a,b,c){
    $(element).parents('table').children('tr').css("background-color", "#fbfbfb");
  }
</script>

因为我想突出显示点击的那个(已经有代码),剩下的我想重置为以前的背景颜色..那是y

有什么建议吗?

最佳答案

试试这个:- 使用 find() 函数而不是 children() 函数。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
      <tr style="color: rgb(31, 73, 125); background-color: #eaeaea;"><td style="padding-left: 5px;"><a style="cursor: pointer;" onclick="download_excel(this,'BL8','ATR','AWFR')">ATR-ADM-BLCMA8-CHN18-03-01-D</a></td><td>14</td><td>0</td><td>56</td><td>56</td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td></tr>
<tr style="color: rgb(31, 73, 125); background-color: #eaeaea;"><td style="padding-left: 5px;"><a style="cursor: pointer;" onclick="download_excel(this,'BL8','ATR','AWFR')">ATR-ADM-BLCMA8-CHN18-03-01-D</a></td><td>14</td><td>0</td><td>56</td><td>56</td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td></tr>
<tr style="color: rgb(31, 73, 125); background-color: #eaeaea;"><td style="padding-left: 5px;"><a style="cursor: pointer;" onclick="download_excel(this,'BL8','ATR','AWFR')">ATR-ADM-BLCMA8-CHN18-03-01-D</a></td><td>14</td><td>0</td><td>56</td><td>56</td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td></tr>
    </table>
    <script>
    function download_excel(element,a,b,c){
     $(element).parents('table').find('tr').css("background-color", "#fbfbfb");
    }
    </script>

关于javascript - 如果使用 Jquery 单击 td,则为表内的所有 tr 元素着色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52905462/

相关文章:

jQuery 按类选择 VS 按属性选择

javascript - Knockoutjs 不工作

javascript - CKEditor 覆盖通知 DOM

javascript - 从 Controller 继承隔离范围以创建可重用指令

javascript - html 选择启用禁用属性

html - 如何在 Ruby on Rails 中截断超链接文本而不是超链接本身?

html - 有效网页加载速度更快吗?

javascript - datejs在javascript中覆盖日期

javascript - 使用 onClick 事件发送 GA 事件

jquery - wordpress + jquery 语法错误