製作複選框和廣播標籤可點擊

大量的（我敢說大多數？）網站不會使標籤對其複選框和廣播輸入點擊。這似乎是一個巨大的可用性收益很少的努力。使用<label>是否有任何兼容性/功能性/可用性問題會阻礙開發人員使用此標籤？製作複選框和廣播標籤可點擊

編輯：即使StackOverflow上似乎犯了這一點，例如，問一個問題時，該日常通知任何新的答案複選框標籤是無法點擊。

來源

2010-02-13 RedFilter

如果我沒記錯的話''在HTML 4中引入的，之後還有HTML表單來的。所以它的用法主要是因爲*傳統*（從視圖源學習）不包括它，它不需要正確的視覺外觀和普通功能（可點擊複選框）。 – 2010-02-13 14:32:12

我已經知道了一段時間，但從現在開始，我會更多地使用它。 – AndrewB 2013-09-05 20:53:28

沒有理由，除了懶惰。 <label> s對於可訪問性來說是必不可少的，對於我們這些對我們的鼠標點擊不好的人來說也非常方便:)

來源

2010-02-13 13:14:00 Ray

嘿，告訴傑夫阿特伍德，看看我上面的編輯。 – RedFilter 2010-02-13 14:02:45

oops - 儘管配置文件首選項頁面上的複選框確實有標籤 – Ray 2010-02-13 14:31:29

是的，它在整個網站中不一致。 – RedFilter 2010-02-16 20:04:35

<label>是一個純HTML標記，不需要JavaScript。我想所有（主要）瀏覽器都支持這個標籤，因爲它很容易實現。

因爲很多開發商都沒有使用它：

它需要更多的努力（加上隨處可見的所有標籤）
他們不知道它的存在
他們不認爲這是方便？！

但沒有理由不使用標籤。除非你是非常限制你的帶寬，也許？

來源

2010-02-13 13:15:34 Veger

我認爲帶寬評論只適用於一些最受歡迎的網站，例如谷歌。 – alex 2010-05-10 01:00:13

我完全同意，但這是我能想到爲什麼不使用''標籤的唯一原因。 – Veger 2010-05-10 07:54:38

@alex：確實如此，Google不會使用''標記，我只是進入了我的帳戶設置並進行了檢查。我覺得很奇怪。 – RedFilter 2010-05-10 14:03:54

不，沒有問題，但不幸的是這是一個的most ignored html tags。同意，這個標籤是可訪問的原因非常重要，更重要的是，當涉及到佈局小型設備，如手機，就不能沒有這個。

來源

2010-02-13 13:20:10 Sarfraz

移動重要性+1。和不錯的鏈接，謝謝。如果你去他們的註冊頁面，你會注意到他們沒有使用''標籤。 :) – RedFilter 2010-02-13 13:33:06

@OrbMan：這就是爲什麼我提出了+1的問題，你問過，並且猜測即使我已經回答了，但我自己從來沒有關心過它。 :) – Sarfraz 2010-02-13 13:43:06

就像正確的Tab鍵順序（甚至是Tab鍵能力），熱鍵和一般用鍵盤做事的能力正在緩慢但肯定地從軟件中消失... – 2011-03-03 11:58:39

我能想到的唯一的困難是，你的表單控件需要有一個ID屬性，ID屬性需要在您的網頁中是唯一的。

如果你是編程生成的表單域，你會產生爲他們每個人，他們出現在每個頁面內唯一的ID。這可能是一個問題。

但一般來說，是的，我認爲這只是程序員沒有在腦海中。

在ASP.NET WebForms（或其他所謂的）中，您需要<asp:Label>元素上的AssociatedControlID屬性。

來源

2010-02-13 14:12:44

+1爲探索實施障礙 – RedFilter 2010-02-13 14:29:52

Form控件不需要ID：這裏是一個標籤 – 2010-02-14 20:44:26

我想我已經看到瀏覽器不會實現click-label-to-select-form-field 'id'屬性。偶爾，出於佈局原因，您不希望自己的表單字段位於''標籤中。（雖然不常見）。 – 2010-02-14 21:14:23

這裏是demonstration爲那些看如何做到這一點。

有連接與元素本身的表單元素附近的文本的方式，所以任何一個可以點擊來激活控件：

你會用你的飲料樣？

<label for="ice1"><input type="checkbox" name="withice" id="ice1">ice</label> 
<label for="ice2"><input type="checkbox" name="withlid" id="ice2">plastic lid</label> 
<label for="ice3"><input type="checkbox" name="withstraw" id="ice3">straw</label>

來源

2012-05-24 21:08:54 Isurus

您的鏈接已損壞。 – Sildoreth 2013-12-20 17:11:03

如果將輸入標籤包裝在標籤中，則根本不需要ID和ID – 2014-07-27 13:09:15

製作複選框和廣播標籤可點擊

回答

相關問題