如何获取表格内带指定LogId的input值并赋值到模态框输入框？

看起来你的代码有几个关键问题导致无法正确获取对应的值，我来帮你一步步修复：

1. 首要问题：重复的ID属性 #

HTML规范里明确要求页面内的ID必须唯一，但你的代码里每个<tr>都包含了id="bRequest"、id="bResponse"等同ID的元素，这会导致jQuery的ID选择器只会匹配到页面中第一个出现的元素，后续的都无法被正确选中。

修复HTML：把ID改为Class #

先修改你的HTML，将重复的id替换为class，同时调整onclick参数为当前行元素：

<tr role="row" class="odd" style="cursor: pointer;" data-toggle="modal" data-target="#modal-detail" onclick="openDetailModel(this)">
  <td class="">
    <input type="hidden" logId="<%= searchtrans.getLogId() %>" class="bRequest" value="<%=searchtrans.getBRequest()%>" >
    <input type="hidden" logId="<%= searchtrans.getLogId() %>" class="bResponse" value="<%= searchtrans.getBResponse() %>">
    <input type="hidden" logId="<%= searchtrans.getLogId() %>" class="sRequest" value="<%= searchtrans.getSRequest()%>" >
    <input type="hidden" logId="<%= searchtrans.getLogId() %>" class="sResponse" value="<%=searchtrans.getSResponse()%>">
  </td>
</tr>

2. 修复JavaScript代码 #

现在修改你的openDetailModel函数，基于传入的<tr>元素直接查找内部的输入框，这种方式比依赖logId更可靠：

function openDetailModel(currentRow) {
  // 从当前点击的行内精准查找对应hidden输入框
  var bRequest = $(currentRow).find('.bRequest').val();
  var bResponse = $(currentRow).find('.bResponse').val();
  var sRequest = $(currentRow).find('.sRequest').val();
  var sResponse = $(currentRow).find('.sResponse').val();

  // 赋值到模态框的输入框
  document.getElementById('modelBRequest').value = bRequest;
  document.getElementById('modelBResponse').value = bResponse;
  document.getElementById('modelSRequest').value = sRequest;
  document.getElementById('modelSResponse').value = sResponse;
}

如果你坚持要使用logId属性（不推荐） #

如果因为业务需求必须保留logId属性来查找，需要注意选择器的格式（不要有多余空格），同时依然要把ID改为Class避免重复问题：

function openDetailModel(detailVal) {
  var value = detailVal;
  // 注意属性选择器里不要加多余空格，确保匹配精准
  var bRequest = $(".bRequest[logId='"+value+"']").val();
  var bResponse = $(".bResponse[logId='"+value+"']").val();
  var sRequest = $(".sRequest[logId='"+value+"']").val();
  var sResponse = $(".sResponse[logId='"+value+"']").val();

  // 赋值逻辑保持不变
  document.getElementById('modelBRequest').value = bRequest;
  document.getElementById('modelBResponse').value = bResponse;
  document.getElementById('modelSRequest').value = sRequest;
  document.getElementById('modelSResponse').value = sResponse;
}

为什么之前的代码失败？ #

• 重复ID导致选择器只能匹配页面中第一个同ID元素
• 选择器里的多余空格（logId ='）导致属性选择器无法正确匹配目标元素
• $('#sRequest').val()没有过滤logId，直接取了第一个匹配的元素值

这样修改后，应该就能正确获取对应行的hidden输入框值并赋值到模态框里了。

内容的提问来源于stack exchange，提问作者AbouLkhair