使整个行可点击

Question

I was trying to make a whole row of my tables on jsp page clickable for it i wrote following code in jsp page : 我试图让我在jsp页面上的整个表格行都可点击，因为我在jsp页面上编写了以下代码：

<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.beans.Statement"%>
<%@page import="java.sql.Connection"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/clickablerow.js"></script>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>MY DATA</title>
</head>
<body>
<%!Connection con; %>
<%!PreparedStatement s; %>
<%!ResultSet rs; %>

<% String name=request.getParameter("q");
//out.println(name);
try{
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
con=DriverManager.getConnection("jdbc:odbc:SharedCryptography", "fyp", "fyp");

String groupidd = request.getSession().getAttribute("groupid").toString();

//out.println(groupidd);
/*String sql="select * from tbIndividual where I_NAME like ? "
        + "and I_ID in "
        + "(select I_ID from TBWAITINDIVIDUALS "
        + "where GROUP_ID <> '"+groupidd+"')";
*/
String sql="select * from tbIndividual where I_NAME like ?";




s = con.prepareStatement(sql);
s.setString(1, name + "%");
rs=s.executeQuery();
}
catch(Exception e){ 
e.printStackTrace(); 
}
%>

<div id="dtl_table"><table border='3' cellpadding='5' cellspacing='2' width="400px">
<tr bgcolor="66FF00">

<th>ID</th>
<th>NAME</th>
<th>FIRSTNAME</th>
<th>LASTNAME</th>
</tr>


<% while(rs.next())
{ %>
<%String storid=rs.getString(1);%>
<tr class="clickableRow" href="individualdetailstoadd.jsp?personid=<%=storid%>">
<td><%=storid%></td>
<td><%=rs.getString(2)%></td>
<td><%=rs.getString(4)%></td>
<td><%=rs.getString(5)%></td>
</tr>
<tr/>
<% } %>
</tr>
</table></div>

</body>
</html>

And included 并包括

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/clickablerow.js"></script>

at top of the page and in clickablerow.js i wrote : 在页面顶部和在clickablerow.js中，我写道：

jQuery(document).ready(function($) {
  $(".clickableRow").click(function() {
        window.document.location = $(this).attr("href");
  });
});

Am i doing something wrong?As this is not working. 我做错什么了吗？

Answer 1

first of all, you can reduce your jQuery ready call to: 首先，您可以将jQuery ready调用减少为：

$(function() {
}

its the exact same. 完全一样。

now, i think you would want to delegate your click handler, meaning you attach it to the document instead, so the document will search for the clickable row and handle its click events: 现在，我认为您想委托单击处理程序，这意味着您将其附加到文档上，因此文档将搜索可单击的行并处理其单击事件：

$(function() {
  $(document).on("click",".clickableRow",function() {
        window.document.location = $(this).attr("href");
  });
});

Answer 2

href is a wrong attribute for tr href是tr的错误属性

You can use the concept of data 您可以使用data的概念

Example: 例：

Prefix href with data 带有数据的前缀href

<tr class="clickableRow" data-href="

Write JQuery as below 编写JQuery如下

$(".clickableRow").click(function() {
        window.document.location = $(this).data("href");
});

使整个行可点击

问题描述

2 个解决方案

解决方案1
1 2014-03-29 14:11:10

解决方案2
0 2014-03-29 14:12:28

Example: 例：

使整个行可点击

问题描述

2 个解决方案

解决方案1 1 2014-03-29 14:11:10

解决方案2 0 2014-03-29 14:12:28

Example: 例：

解决方案1
1 2014-03-29 14:11:10

解决方案2
0 2014-03-29 14:12:28