如何在jQuery中使用嵌套选择器

Question

只是在jQuery中测试了一些代码片段，基本上我的代码中的错误现在就在此部分：

的HTML

<div id="qi_table">
        <tr name="1">
            <td>
                <input type="text" name="qty" class="qty">
            </td>
        </tr>
        <tr name="2">
            <td>
                <input type="text" name="qty" class="qty">
            </td>
        </tr>
        <tr name="3">
            <td>
                <input type="text" name="qty" class="qty">
            </td>
        </tr>
</div>

JS

var sysID = 2;

$('#qi_table tr').eq(0).find('input[name=qty]').val( sysID );

我期望结果是3个文本输入字段，第一个文本字段用数字“ 2”填充。

结果是我只得到3个空文本字段。 这是怎么回事？ 我是否使用jQuery后代选择器不正确？

链接： http ： //jsfiddle.net/1nf6n0vf/1/

框架设置为jQuery 1.10.1

Answer 1

您的jQuery很好，您需要在<table>元素内包含<table> <tr>元素。

http://jsfiddle.net/1nf6n0vf/2/

Answer 2

您需要更改HTML，以使表行和单元格位于table内部（而不仅仅是div ）；

<table id="qi_table">
        <tr name="1">
            <td>
                <input type="text" name="qty" class="qty">
            </td>
        </tr>
        <tr name="2">
            <td>
                <input type="text" name="qty" class="qty">
            </td>
        </tr>
        <tr name="3">
            <td>
                <input type="text" name="qty" class="qty">
            </td>
        </tr>
</table>

然后，您的jQuery应该可以正常工作。

Answer 3

您可以简化查询：

$("input[name='qty']", "#qi_table").val(sysID);

然后，您在qi_table中搜索所有输入。