Question

我在列表视图中有一个html表，并在其中有一个名为＆＃34; vehicle_num＆＃34;的隐藏标签。我能够获得表格的选定行以及任何td，但是我似乎无法获得标签的值。我试过了：

var vehicle_number = $(this).closest('tr').children('#vehicle_num').text();

以下是listview的代码。我怎样才能获得标签的价值？

<asp:ListView ID="lvEquipmentList" runat="server" DataKeyNames="vehicle_number">
    <LayoutTemplate>
            <table id="table-equipment-list" class="table table-list">
                <thead>
                    <tr>
                        <th scope="col" class="product-line">Product line</th>
                        <th scope="col" class="model-number">Model #</th>
                        <th scope="col" class="serial-number">Serial #</th>
                        <th scope="col" class="dar-status">DAR Status</th>
                        <th scope="col" class="ship-date">Ship Date</th>
                    </tr>
                </thead>
                <tbody>
                    <asp:PlaceHolder ID="ItemPlaceholder" runat="server" /> 
                </tbody>
            </table>
    </LayoutTemplate>
    <ItemTemplate>
        <tr>
            <th scope="row" class="product-line"><div class="icon"><img src='<%#Eval("image_path")%>' onerror="this.src='assets/images/placeholder.png';" alt=""/></div> <span class="line-title"><%#Eval("product_line")%></span></th>
            <td class="model-number"><%#Eval("model")%><label class="vehicle_num" hidden="hidden"><%#Eval("vehicle_number")%></label></td>
            <td class="serial-number"><%#Eval("serial_number")%></td>
            <td class="dar-status"><img src='<%#Eval("display_status") %>'/></td>
            <td class="ship-date"><%#Eval("date")%></td>
        </tr>
    </ItemTemplate>
    <EmptyDataTemplate>
        <table id="table-equipment-list" class="table table-list">
            <thead>
                <tr>
                    <th scope="col" class="product-line">Product line</th>
                    <th scope="col" class="model-number">Model #</th>
                    <th scope="col" class="serial-number">Serial #</th>
                    <th scope="col" class="dar-status">DAR Status</th>
                    <th scope="col" class="ship-date">Ship Date</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th scope="row" class="product-line"><div class="icon"></div> <span class="line-title"></span></th>
                    <td class="model-number"></td>
                    <td class="serial-number"></td>
                    <td class="dar-status"></td>
                    <td class="ship-date"></td>
                </tr>   
            </tbody>
        </table>
    </EmptyDataTemplate>
</asp:ListView>

修改

我编辑了上面的代码，将标签放在表格列中。我能够使用：

获得价值

var vehicle_number = $(this).closest('tr').find('.vehicle_num').text();

Answer 1

这是无效的标记：

<tr>
    <th scope="row" class="product-line"><div class="icon"><img src='<%#Eval("image_path")%>' onerror="this.src='assets/images/placeholder.png';" alt=""/></div> <span class="line-title"><%#Eval("product_line")%></span></th>
    <td class="model-number"><%#Eval("model")%></td>
    <td class="serial-number"><%#Eval("serial_number")%></td>
    <td class="dar-status"><img src='<%#Eval("display_status") %>'/></td>
    <td class="ship-date"><%#Eval("date")%></td>
    <label id="vehicle_num" hidden="hidden" runat="server"><%#Eval("vehicle_number")%></label>
</tr>

作为label的孩子，有一个错误的tr，这是无效的。当浏览器试图弄清楚这一点时，可能会用label做任何事情来构造一个有效的DOM，这将影响你的jQuery选择器。

label需要位于表格单元格中：

<tr>
    <th scope="row" class="product-line"><div class="icon"><img src='<%#Eval("image_path")%>' onerror="this.src='assets/images/placeholder.png';" alt=""/></div> <span class="line-title"><%#Eval("product_line")%></span></th>
    <td class="model-number"><%#Eval("model")%></td>
    <td class="serial-number"><%#Eval("serial_number")%></td>
    <td class="dar-status"><img src='<%#Eval("display_status") %>'/></td>
    <td class="ship-date"><%#Eval("date")%></td>
    <td><label id="vehicle_num" hidden="hidden" runat="server"><%#Eval("vehicle_number")%></label></td>
</tr>

（或者，如果它总是被隐藏，你可以把它放在一个现有的表格单元格中。无论哪种方式都应该有效。）

此外，如果在此处显式设置了客户端id，那么这些记录的任何重复都将导致DOM中的重复id，这也是无效的。当存在重复的id时，不同的浏览器会以不同的方式响应基于id的选择器，因为行为未定义。你可能想要使用一个类：

<label class="vehicle_num" ...

由于label不再是tr的孩子而是后代，所以请改用find() children()：

$(this).closest('tr').find('.vehicle_num')

使用jquery获取表中隐藏标签的值？

1 个答案: