我希望行可以点击,突出显示行中的相应按钮。怎么做?

时间:2016-08-01 15:37:52

标签: jsp

我的HTML表从数据库中提取数据。数据库中的行是在HTML表中提取的。每个表都有一个按钮。我想单击特定行并突出显示该特定按钮。

  try{
            Class.forName("com.mysql.jdbc.Driver");
        Connection conn = DriverManager.getConnection("jdbc:mysql://localhost/lvcdatabase","root","java");
        String query = "Select * from kitchentable;";
        PreparedStatement pst = conn.prepareStatement(query);
        ResultSet rs =pst.executeQuery(query);
        while(rs.next()){
   %>

   <form action="processorder" method="">
      <table id="example" >
      <%String s = String.valueOf(rs.getInt("orderno"));%>
        <tr id="row<%=s%>" onclick="a(<%=s%>)">
          <td><%=rs.getInt("orderno")%></td>
          <td><%=rs.getString(3)%></td>
          <td><%=rs.getString(3)%></td>
          <td><%=rs.getString(5)%></td>
          <td><input class="service" id="service<%=s%>" onclick="b(<%=s%>)" type="button" value="Service Status"></td>
         </tr>




         <tr id="buttonrow">
           <td colspan="1"></td>
           <td colspan="1"><input type="button" style="background-color:#ff0000" value="Pending" id="redbutton<%=s%>" class="statusbutton"></td>
           <td colspan="1"><input type="button" style="background-color:#ffbf50" value="Cooking" id="amberbutton<%=s%>" class="statusbutton"></td>
           <td colspan="1"><input type="button" style="background-color:#66ff66" value="Cooked" id="greenbutton<%=s%>" class="statusbutton"></td>
           <td colspan="1"></td>
         </tr>



   </form><br>
   <%} %>
   </table>
   <%rs.close();
   pst.close();
   conn.close();
   }catch(Exception e){

        System.out.println("Error: "+e.getMessage());
    }
    %>

我的javascript代码: (通过谷歌搜索帮助我,我得到了所需的输出)

<script>

function a(x){
    document.getElementById("redbutton"+x).style.backgroundColor ="#b20000";
    document.getElementById("redbutton"+x).value="Queued";
   document.getElementById("amberbutton"+x).style.backgroundColor="#ffbf00";
    document.getElementById("amberbutton"+x).value ="Processing";
}

function b(x){

document.getElementById("greenbutton"+x).style.backgroundColor="green";
document.getElementById("amberbutton"+x).style.backgroundColor="#ffbf50";
document.getElementById("service"+x).value="Serviced";

}

0 个答案:

没有答案