爲什麼隱藏時隱藏複選框的標籤？

我有一個複選框：爲什麼隱藏時隱藏複選框的標籤？

<input type="checkbox" id="OutOfPocket">Are you okay with paying out-of-pocket for these services?</input>

和我有一些jQuery來隱藏它：

$('#OutOfPocket').hide();

，但問題是該行不會隱藏標籤。所以，我想下面的命令來隱藏標籤，但都沒有成功：

$('#OutOfPocket').next('label').hide(); 
$('#OutOfPocket').siblings('label').hide(); 
$('#OutOfPocket').next('input ~ label').hide(); 
$('#OutOfPocket').next('span').hide(); 
$('#OutOfPocket').siblings('span').hide(); 
$('#OutOfPocket').next('input ~ span').hide();

什麼代碼，我需要隱藏的複選框的文本？

來源

2013-05-07 Mike Perrenoud

哪裏是相對於輸入的標籤嗎？ – Jace 2013-05-07 02:37:31

這不是你的問題的答案，但爲什麼不把它們放在容器中並隱藏容器？ – xaxxon 2013-05-07 02:39:04

@Jace，基於呈現的HTML，它位於同一級別的'input'旁邊。如果您將我提供的HTML放在空白頁面上，您會看到它旁邊呈現的標籤（即複選框的文本）。 – 2013-05-07 02:39:13

據我所知，<input/>不支持這樣的內部文本。從<input> on MDN：

允許的內容 - 無，這是一個void元素。

雖然它可能會顯示爲您使用的任何瀏覽器的標籤，但您可能希望使用實際的<label>作爲標籤。

<input type="checkbox" id="OutOfPocket"/><label for="OutOfPocket">Are you okay with paying out-of-pocket for these services?</label>

來源

2013-05-07 02:39:34

要添加到羅布的答案，輸入標籤是自閉的。對於複選框，value屬性是隱藏的。所以，你的確會寫輸入標籤後標籤：

<input type="checkbox">Are you okay with paying out-of-pocket for these services?

在這種情況下，你需要或者包裝容器中的東西，即span標籤或包裝的標籤的文本。

來源

2013-05-07 02:41:29

試試這個：

<label for="OutOfPocket"> 
<input type="checkbox" id="OutOfPocket"/> 
    <span>Are you okay with paying out-of-pocket for these services?</span> 
</label>

這樣，當你在文本中單擊複選框進行檢查。

而且可以輕鬆地隱藏文本：

$('label span').hide()

來源

2013-05-07 02:41:43 juanpastas

爲什麼隱藏時隱藏複選框的標籤？

回答

相關問題