圍繞其他元素包裝<label>有什麼問題嗎？

我想在表格中有三個單元格，當你點擊它們時選擇相應的複選框，所以我用一個標籤標籤來包裝它們。圍繞其他元素包裝<label>有什麼問題嗎？

<table> 
    <tr> 
    <td> 
     <input id="input_id" type="checkbox"> 
    </td> 
    <label for='input_id'> 
     <td>stuff</td> 
     <td>stuff</td> 
     <td>stuff</td> 
    </label> 
    </tr> 
</table>

很不幸，這打破了點擊功能。通常，當您單擊標籤中的文本時，它會切換檢查，但這不適用於封裝元素。任何想法爲什麼？如果是，或者有什麼理由，這是一個壞主意？

有趣的是，它的工作，如果我用周圍的細胞內容物三個獨立的標籤具有相同「的」屬性....

來源

2013-07-11 TorranceScott

我只是跑了一個測試，它可以在Chrome上運行。你正在使用哪種瀏覽器？從技術上講，這是無效的HTML。您需要在標籤內有

和標籤才能生效，這可能有所幫助。 –

對不起，我不是故意讓我的html有效性成爲問題的關鍵。我已經更新了結構以減少混淆。我正在使用chrome，並且只能將每個單元格內容包裝在標籤中才能使其工作。例如：http://jsfiddle.net/rxwHp/ – TorranceScott

回答

這是一個壞主意，寫無效加價，按您的例子。應包裝td的唯一元素是tr。

就目前而言，您的示例不會破壞點擊功能，因爲td標籤將被解析器丟棄。但是，如果示例在表格和tr元素內，則輸入和標籤元素將移動到表格之前，因此不會包裝td或「stuff」文本（其中留在桌子內），所以點擊該文字將不起作用。

來源

2013-07-11 23:47:59 Alohci

即使在'忽略'剩下的表格元素之後，發生了什麼，但是在該行爲背後有什麼推理？只要它們實際上是輸入的標籤，你不應該能夠在標籤中使用任何數量的元素嗎？ – TorranceScott

真的，推理是它必須以這種方式使瀏覽器能夠處理舊的HTML。一些主導市場的舊瀏覽器（這種情況下可能是Netscape 2或3）就是這樣做的，網頁依賴於它，因此所有現代瀏覽器都必須這樣做。因此，一些解析規則是非常奇怪的，你只需要接受它就是這樣。 – Alohci

相關問題