使用jquery获取表中隐藏标签的值
Get value of hidden label in table using jquery?
我在列表视图中有一个html表,其中有一个隐藏的标签,名为"vehicle_num"。我可以获得表中所选的行以及任何td,但我似乎无法获得标签的值。我试过:
var vehicle_number = $(this).closest('tr').children('#vehicle_num').text();
下面是列表视图的代码。如何获取标签的值?
<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();
这是无效标记:
<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
的子级,而是其的子级$(this).closest('tr').find('.vehicle_num')
相关文章:
- HTML5在提交并显示所需标签后显示隐藏的表单元素
- Chart.js条形图:网格颜色和隐藏标签
- Chart.js条形图标签在悬停时被隐藏
- ng高图表的响应行为,加载时隐藏编译的ng点击xAxis标签
- 如何隐藏和显示标签控件JavaScript
- 有没有一种方法可以为卸载的lazylod图像隐藏alt标签
- 隐藏 DIV 标签,直到填充所有文本字段
- 如何使用 JavaScriptJQuery 将隐藏输入标签的值与选择标签的选定选项的值进行设置
- 在Chart.js中隐藏y轴上的标签
- 根据单选按钮隐藏标签的函数
- 如果在使用IE 7或8时隐藏,则单击标签不选中复选框
- Tabindex Dosent隐藏li标签的内容
- 如何更改CSS文件或隐藏<link>标签
- 如何在没有代码隐藏访问权限的情况下将自定义 HTML 属性添加到 ASP.NET 标签
- 如何隐藏没有类的标签元素
- 单击文本区域可隐藏标签值
- 显示/隐藏<跨度>标签
- 如何从角度控制器隐藏标题标签
- 使显示标签隐藏
- 默认情况下,当html标签隐藏时,谷歌地图不会渲染整个帧