JQuery 选择器 Table 单元格

Question

我试图在单击名为 RoomTypes[0].RoomOptionId 的单选按钮时获取名称为 Promotion_26615 的文本框的值。

我试过几个选择器，但没有任何效果。例如：

$('.radio').click(function () {
  var t = $(this)prev().prev().prev().prev().find("input[name*=Promotion_]").val();
});

和 html:

<tbody>
  <tr>
    <td class="roomtypeheader"><b>Free Nights - Stay 7 Pay 6 (Double Reethi)</b></td>
    <td data-title="Room Type" class="roomtypeheader">Reethi Villa</td>
    <td data-title="Board Type" class="roomtypeheader">Bed &amp; Breakfast</td>
    <td data-title="Price" class="roomtypeheader">6.00 pp</td>
    <td data-title="Select" class="roomtypeheader">
      <div class="radio">
        <label>
          <input type="radio" name="RoomTypes[0].RoomOptionId" value="a3fb34ee-4ec2-41cc-a093-be25ba75b0c9">
          <input type="hidden" name="RoomOptionPrice" value="816">
          <input type="hidden" name="RoomOptionChildPrice" value="0">
          <input type="hidden" name="NumberOfAdults" value="1">
          <input type="hidden" name="NumberOfChildren" value="0">
          <span class="hidden">option1</span>
        </label>
      </div>
    </td>
  </tr>
  <tr>
    <td></td>
    <td>Honeymoon Offer</td>
    <td></td>
    <td>.00</td>
    <td><input type="checkbox" name="Promotion_26615" value="72.0000" /></td>
  </tr>

Answer 1

您的代码似乎有错别字：

$(this)prev() 开头应为 $(this).prev()（缺少句号/句号）

我认为如果您在运行代码所在的任何浏览器中使用 javascript 控制台，您将看到语法错误。

假设您的代码的 prev()prev().prev().prev().prev() 部分用于将 DOM 遍历回父 form 元素，下面的代码会更合适：

$('.radio').click(function() {
  var t = $(this).parents('form').find('input[name*="Promotion_"]').val();
});

Answer 2

您可以在父行的兄弟姐妹中找到：

var t = $(this).parents('tr').siblings().find("input[name*=Promotion_]").val();

Answer 3

我会使用：

var t = $(this).closest('tr').next().find("input[name*=Promotion_]").val();

jsFiddle example

.prev() 将不起作用，因为 select 是前一个兄弟姐妹，您需要一个祖先（.closest() 或 .parent() 或 .parents() 会select).

JQuery 选择器 Table 单元格

JQuery Selector Table Cells

jquery

html-table

selector