选择特定行和列中的特定输入元素

Posted 2023-03-05

【中文标题】选择特定行和列中的特定输入元素

【英文标题】：select specific input element in a specific row and column

【发布时间】：2012-01-02 12:30:29

【问题描述】：

考虑这张图片：

如何在没有 jQuery 的 ID 的情况下选择它？我的意思是我怎么能像这样选择它：

在 Code=1000 和列 Desc2 的行中查找输入

谢谢

编辑 1)

html 代码

<table border="1" >
    <tr>
        <td>
            Desc2
        </td>
        <td>
            Desc1
        </td>
        <td>
            Code
        </td>
    </tr>
    <tr>
        <td bgcolor="#CCCCB3">
            <input id="Text1" type="text" />
        </td>
        <td>
        </td>
        <td>
            1000
        </td>
    </tr>
    <tr>
        <td bgcolor="#FFFFCC">
            &nbsp;
        </td>
        <td bgcolor="#FFFFCC">
        </td>
        <td bgcolor="#FFFFCC">
        </td>
    </tr>
    <tr>
        <td bgcolor="#CCCCB3">
            <input id="Text2" type="text" />
        </td>
        <td>
        </td>
        <td>
            1001
        </td>
        <tr>
            <td bgcolor="#CCCCB3" class="style1">
                <input id="Text3" type="text" />
            </td>
            <td class="style1">
            </td>
            <td class="style1">
                1002
            </td>
        </tr>
        <tr>
            <td bgcolor="#CCCCB3">
                <input id="Text4" type="text" />
            </td>
            <td>
            </td>
            <td>
                1003
            </td>
        </tr>
</table>

【问题讨论】：

如果您发布示例的 html 而不是图像，这将更容易提供帮助。那是整张桌子还是只是其中的一部分？我的意思是，如果每行只有一个输入字段，那就很简单了。

【参考方案1】：

选择最后一个单元格，过滤最后一个单元格值为“1000”的行，并选择集合的第一个输入元素：

$("table td:last-of-type").filter(function()
    return $(this).text() == "1000";
).parent().find("input:first");

为了构建这样的选择器，你可以使用以下：

:eq() 和 .eq() :nth-child()（仅针对特定的子职位！）

警告：不要不要落入contains()的陷阱。此方法选择包含给定短语的所有元素。 .contains(1000) 也会选择 <td>10000</td>。

【讨论】：

谢谢。我在我的页面中添加了您的代码，但它不起作用。我使用此代码：var a = $("table td:last-of-type").filter(function () return $(this).text() == "1000"; ).parent().find("input:first"); $(a).text("nima"); 。 last-of-type 是什么？

td:last-of-type 是一个 CSS 选择器，它选择每个 <td> 元素，它是其类型的最后一个，相对于其父元素。你能提供一个小提琴吗？

您的代码包含空格。使用$.trim 删除开头和结尾的空格。此外，我的代码已经返回了一个 jQuery 对象，因此无需将其包装在另一个 jQuery 对象中。小提琴：jsfiddle.net/7qyFk/5

谢谢它的工作，但它需要$ 来获取它的attr ;)。我想要一个通用的方法来做到这一点。last-of-type 是一个有限的解决方案。如果我的输入是在Desc2 列中如何选择？

示例：选择第 5 行，第 2 单元格：$("table > tr:nth-child(5) > td:nth-child(2)")。