使用jquery獲取表中隱藏標籤的值？

Question

我在列表視圖中有一個html表格，並在其中有一個名爲「vehicle_num」的隱藏標籤。我能夠得到選定的表格行，以及任何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> 

EDIT

我已編輯上面的代碼把標籤在表列中。我是能夠得到使用值：

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 s，這也是無效的。當存在重複的id時，不同的瀏覽器以不同的方式響應id的選擇器，因爲行爲未定義。你可能想使用一個類來代替：

<label class="vehicle_num" ... 

由於label不再是孩子的tr的而是後裔它，使用find()代替children()：

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