在单击行时，使用JSTL显示的表中将行ID传递给jQuery

Question

i正在使用JSTL foreach loop.on单击一行的数据列表作为表，该行中的各个ID值需要发送到jquery onclick（）函数。表 -

  <table border="1" width="90%" class="table-hover" id="warehouseValue">
    <tr>
        <th>Warehouse Id</th>
        <th>Warehouse Location</th>
        <th>Warehouse City</th>
        <th>Zone</th>
    </tr>
     <c:forEach items="${sessionScope.listWarehouse}" var="description">
         <tr>        
            <td>
               <input type="hidden" id="idValue" value="${description.getWarehouseId()}" />
               ${description.getWarehouseId()}
            </td>
            <td>${description.getWarehouseLocation()}</td>
            <td>${description.getWarehouseCity()}</td>
            <td>${description.getWarehouseDescription().getZone()}</td>
        </tr>
     </c:forEach> 
</table>

jquery onclick（）函数 -

$(document).ready(function() {
   $("#warehouseValue").click(function() {
      var rowId = document.getElementById("idValue").value;
      alert("new "+rowId);
   });
});

单击任何一行，仅第一行的ID-$ {description.getHouseid（）}正在显示。如何使每行的各个ID值发送到OnClick（）函数

Answer 1

您可以这样得到。td有一个子输入元素。

$("#warehouseValue").on('click','td',function(event) {
        // td has a child input 
        var value1 = $(event.target.children[0]).val();
        var value2 = $(event.target).children("input").val();
        console.log(value1+" "+value2);
});

Answer 2

尝试一下。我发表评论太久了，但不要将其视为答案。

<tr>
    <th>Warehouse Id</th>
    <th>Warehouse Location</th>
    <th>Warehouse City</th>
    <th>Zone</th>
</tr>
 <c:forEach items="${sessionScope.listWarehouse}" var="description">
     <tr>        
        <td>
           <input type="hidden" class="id-input" id="idValue" value="${description.getWarehouseId()}" />
           ${description.getWarehouseId()}
        </td>
        <td>${description.getWarehouseLocation()}</td>
        <td>${description.getWarehouseCity()}</td>
        <td>${description.getWarehouseDescription().getZone()}</td>
    </tr>
 </c:forEach> 

jQuery

$(document).ready(function() {
   $("#warehouseValue").on('click','tr',(function() {
   var $this = $(this);
   var rowID = $this.find('.id-input');      
      alert("new " + rowId);
   });
});