javascript - jQuery 选择器查找包含具有特定值的 TD INPUT 的 TR

Question

好吧，这看起来应该是一个简单的问题，但答案让我望而却步。我有一个从 JSON 数据构建的表单，我从中构建了一个包含 INPUT 文本控件的 3 行 14 列表。

当任何这些控件中的值发生变化时，我需要找到其第一列中的输入控件等于特定年份的包含行。

这是标记的示例:

<table id="MyTable">
<tr>
    <td><input type="text" /></td>
    <td><input type="text" class="changeHandled"/></td>
    <td><input type="text" class="changeHandled" /></td>
</tr>
</table>

我试过的选择器是:#MyTable tr:has('input[value="{year}"]') 和几十个变体。

我将 {year} 字符串替换为我正在搜索的年份值，因此它最终看起来像:#MyTable tr:has('input[value="2014 "]')

我认为这可能是因为值最初是通过代码设置的，因为如果我使用 #MyTable tr:has('input') 它会返回所有行。

由于可维护性，我不想对路径进行硬编码，而只是在 javascript 代码中说 $(this).closest("tr")...。

知道如何检索包含具有特定值的输入的 TR 的引用吗？如果我的代码是正确的，那么在通过代码设置值时是否需要做一些不同的事情？

Answer 1

选择器 $('#MyTable tr:has(input[value="2014"])') 仅在 input 元素具有硬编码 value 属性，值为 2014。参见 this example .

如果您尝试选择一个没有硬编码 value 属性的 input 元素，那么您可以过滤这些元素并返回 input 元素其值等于 2014。根据您的需要，您可以收听 input 或 change 事件。

Example Here

$('#MyTable input').on('input change', function () {
    $tr = $('#MyTable tr input:first').filter(function () {
        return this.value === '2014' || $(this).attr('value') === '2014';
    }).closest('tr');
});