Jquery找到最近的ID并选择值？答案

【问题标题】：Jquery find closest ID and Select Value?Jquery找到最近的ID并选择值？
【发布时间】：2017-06-01 15:10:13
【问题描述】：

我有一个由这样的行组成的表：

<tr class='child1'>
    <td colspan="2"><img class="parent" src="show.gif">
        <select name="option" class="option" id="0">
            <option value="0">ZERO</option>
            <option value="1">ONE</option>
            <option value="2">TWO</option>
            <option value="3">Three</option>
        </select>
    </td>
    </td><td>
    </td><td>
    </td><td>
</tr>

<tr class='child1'>
    <td colspan="2"><img class="parent" src="show.gif">
        <select name="option" class="option" id="1">
            <option value="0">ZERO</option>
            <option value="1">ONE</option>
            <option value="2">TWO</option>
            <option value="3">Three</option>
        </select>
    </td>
    </td><td>
    </td><td>
    </td><td>
</tr>

我正在使用 JQuery 来尝试查找 Select 的 id 和每个类的 Selected Value .child + id。

$('.child' + id).each(function(i, obj) {
  // How do I get the Select ID and Selected Value ?
});

我不确定如何为每个匹配 class1 的条目获取 Select ID 和 Selected Value

有人可以建议如何做到这一点吗？

谢谢

更新。添加 console.log(this) 显示正确的行，我试过： test = $(this).next("select").val(); 但返回未定义。

【问题讨论】：

标签： jquery select

【解决方案1】：

有几件事：我修复了你不匹配的 td，我添加了一个按钮来证明代码可以正常工作，我删除了唯一的子类，因为它看起来有点错误（如果你愿意，你可以重新添加它，它会抓取选定的 id 和值。

$("button").click(function() {
  
  $('.child').each(function(i, obj) {
    console.log("Index: " + i)
    value = $(this).find(".option").val()
    selectedId = $(this).find(".option").attr("id")
    console.log("Has the value " + value + " and the selectedId of " + selectedId);
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr class='child'>
    <td colspan="2"><img class="parent" src="show.gif">
        <select name="option" class="option" id="0">
            <option value="0">ZERO</option>
            <option value="1">ONE</option>
            <option value="2">TWO</option>
            <option value="3">Three</option>
        </select>
    </td><td>
    </td><td>
    </td><td>
</tr>

<tr class='child'>
    <td colspan="2"><img class="parent" src="show.gif">
        <select name="option" class="option" id="1">
            <option value="0">ZERO</option>
            <option value="1">ONE</option>
            <option value="2">TWO</option>
            <option value="3">Three</option>
        </select>
    </td><td>
    </td><td>
    </td><td>
</tr>
</table>
<button>Test results</button>

【讨论】：

tds 是复制粘贴错字。真正的代码是正确的方法。
不客气，如果您可以标记为解决方案，那将有很大帮助。

【解决方案2】：

$('.child' + id).each(function(i, obj) {
  var selectID = $(this).find("select").attr("id");
  var selectValue = $(this).find("select").val();
});

只有当你在你的孩子里面有选择N

【讨论】：

你的 HTML 错误，你关闭再打开 td 而不是打开再关闭 td
抱歉，这是一个复制和粘贴错误。真正的代码是正确的方法。