使表格行可点击并将post参数传递给jquery函数

Question

我已经创建了一个表格，并用像这样通过 JSTL 标记和 EL 表达式获取的元素填充它

<c:forEach items="${routes_list}" var="route">
    <tr>
       <td>${route.airlane}</td>
       <td>${route.aircraft_id}</td>
       <td>${route.airport_city_source.city}</td>
       <td>${route.airport_city_dest.city}</td>
       <td><fmt:formatDate value="${route.departure_date}" pattern="dd/MM/yyyy hh:mm"/></td>
       <td><fmt:formatDate value="${route.arrival_date}" pattern="dd/MM/yyyy hh:mm"/></td>
       <td>${route.travel_class}</td>
     </tr>
 </c:forEach>

我想做的是让每一行都可以点击。我通过使用这个功能实现了这一点

$("tr").click(function() {
window.location.href = $(this).find("a").attr("href");
});

但我的真正目标是传递给 href ${route.id} 以便向 servlet 发送发布请求并执行一些任务。我不是 jquery 程序员，所以我不知道如何进行。谢谢各位

编辑

$(".show_reservations").click(function() { //show.reservations css class
var href  = $(this).find("a").attr("href");
$.ajax({
    cache:false,
    dataType:"html",
    data:"${route.id}="+href,
    type: "POST",
    url: "admin_show_reservations", //NAME OF THE SERVLET
    success: function(data)
             {
                //console.log(data);
                alert("success"+data);
             },
    error: function(exception)
    {
    alert("error");
    }
    });
});

HTML

<section class="area_principal">
    <h4>Voli</h4>
    <div class="body_area_principal">
        <c:choose>
            <c:when test="${!empty routes_list}">
                <table class="show_reservations">
                    <tr>
                        <th>Compagnia</th>
                        <th>ID Veivolo</th>
                        <th>Partenza</th>
                        <th>Arrivo</th>
                        <th>Ora partenza (ora locale)</th>
                        <th>Ora arrivo (ora locale)</th>
                        <th>Classe</th>
                    </tr>
                    <c:forEach items="${routes_list}" var="route">
                        <tr>
                            <td>${route.airlane}</td>
                            <td>${route.aircraft_id}</td>
                            <td>${route.airport_city_source.city}</td>
                            <td>${route.airport_city_dest.city}</td>
                            <td><fmt:formatDate value="${route.departure_date}" pattern="dd/MM/yyyy hh:mm"/></td>
                            <td><fmt:formatDate value="${route.arrival_date}" pattern="dd/MM/yyyy hh:mm"/></td>
                            <td>${route.travel_class}</td>
                        </tr>
                    </c:forEach>
                </table>
            </c:when>
            <c:otherwise>
                <p>Non ci sono voli nel sistema. Aggiungerli attraverso la voce presente nel menù sulla sinistra</p>
            </c:otherwise>
        </c:choose>
    </div>
</section>

生成的 HTML

<section class="area_principal">
    <h4>Voli</h4>
    <div class="body_area_principal">


                <table class="show_reservations">
                    <tr>
                        <th>Compagnia</th>
                        <th>ID Veivolo</th>
                        <th>Partenza</th>
                        <th>Arrivo</th>
                        <th>Ora partenza (ora locale)</th>
                        <th>Ora arrivo (ora locale)</th>
                        <th>Classe</th>
                    </tr>

                        <tr>
                            <td>Alitalia</td>
                            <td>AZ198EG</td>
                            <td>Catania</td>
                            <td>Milan</td>
                            <td>18/06/2014 07:00</td>
                            <td>18/06/2014 08:35</td>
                            <td>Economy</td>
                        </tr>

                        <tr>
                            <td>Emirates</td>
                            <td>EA343E3</td>
                            <td>Catania</td>
                            <td>Dubai</td>
                            <td>18/06/2014 09:00</td>
                            <td>19/06/2014 05:00</td>
                            <td>Economy</td>
                        </tr>

                </table>



    </div>
</section>

Answer 1

$("tr").click(function() {
var href  = $(this).find("a").attr("href");
 $.ajax({
                cache:false,
                dataType:"html",
                data:"yourparameter="+href,
                type: "POST",
                url: "yourServletContextPath",
                success: function(data)
                    {
                        //console.log(data);
                        alert("success"+data);
                    },
                error: function(exception)
                    {
                    alert("error");
                    }
                });
});

“数据”将包含您的 html 类型响应