Question

<logic:iterate name="studentDetails" id="student" indexId="index">
    <tr>
        <td><bean:write name="student" property="name" /></td>
        <td><bean:write name="student" property="age" /></td>
        <td><bean:write name="student" property="class" /></td>
        <td><bean:write name="student" property="mark" /></td>
        <td><bean:write name="student" property="result" /></td>
    </tr>
</logic:iterate>

我希望显示所有学生的详细信息，并希望在鼠标覆盖结果表中的行时，将不同颜色/设置鼠标指针中传递的学生详细信息突出显示为手势信号。

我如何检查学生详细信息是否通过以及如何在表迭代器中设置突出显示颜色？

Answer 1

就“手势”而言，我认为你的意思是鼠标光标切换到一只手。这可以通过应用样式cursor: pointer;来完成。要突出显示该行，您可以使用:hover伪类。

组合两者，在用鼠标悬停时突出显示每一行红色：

tr:hover {
  cursor: pointer;
  background-color: red;
}

以下示例：

tbody tr:hover {
  background-color: red;
  cursor: pointer;
}

<table>
  <thead>
    <tr>
      <th>Student ID</th>
      <th>First Name</th>
      <th>Last Name</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>John</td>
      <td>Doe</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Bob</td>
      <td>Smith</td>
    </tr>
    <tr>
      <td>3</td>
      <td>Susie</td>
      <td>Snowflake</td>
    </tr>
  </tbody>
</table>

Answer 2

在

中添加onmouseover或onmouseout

<tr onmouseover="ChangeColor(this,${student.result})>

添加脚本

<script type="text/javascript">
    function ChangeBackgroundColor(row, result) { 
        if(result =="pass")
        {
            row.style.backgroundColor = 00FF33;
             $(row).css("cursor","pointer");
        }
        else
            row.style.backgroundColor = #FF0000 ;
 }
</script>

如何将鼠标指针更改为手势信号，并在鼠标移过表格中的一行时更改行的颜色

2 个答案: