Question

在这个Web应用程序中，我从数据库中获取请求，并在jsp页面的表中显示数据。我想添加一个功能，在每行旁边显示一个复选框，只有当鼠标悬停在该行上时才会出现复选框。选中该复选框将使我能够从行中绘制数据，以便将新数据插回到数据库中。任何有关这方面的帮助将非常感谢。谢谢。这是我目前的代码。

<table class="actable" >
 <tr>
  <td>RequestID</td>
  <td>Requester</td>
  <td>Approver</td>
  <td>Status</td>
  <td>Product</td>
  <td>Version</td>
  <td>Source</td>
  <td>Destination</td>
 </tr>
 <%
 for(int i=0;i<reqjsp.size();i++) //reqjsp being the ArrayList that I forward to this jsp from my servlet
 {
 %>
 <tr>  
  <td><%= reqjsp.get(i).getRequestid() %></td>               
  <td><%= reqjsp.get(i).getRequestor() %></td>  
  <td><%= reqjsp.get(i).getApprover() %></td>  
  <td><%= reqjsp.get(i).getStatus() %></td>  
  <td><%= reqjsp.get(i).getProduct() %></td>
  <td><%= reqjsp.get(i).getVersion() %></td>
  <td><%= reqjsp.get(i).getSource() %></td>  
  <td><%= reqjsp.get(i).getDestination() %></td>  
 </tr> 
 <%} %>          
  </table>

Answer 1

您可以使用CSS执行此操作：

.actable tr input[type=checkbox] {
    display: none;
}

.actable tr:hover input[type=checkbox] {
    display: inline-block;
}

Live Example | Live Source

表格每行的隐藏复选框

1 个答案: