使用屬性「的」鏈接

我創造了一個jQuery插件，它改變這樣使用屬性「的」鏈接

<form> 
    <input type="checkbox" id="checkbox_01" value="1"/> 
    <label for="chexkbox_01"></label> 
</form>

形式HTML到這樣的一個形式的自定義元素：

<form> 
    <input type="checkbox" id="checkbox_01" value="1" aria-hidden="true" /> 
    <span role="checkbox" id="aria-checkbox_01" aria-checked="false" tabindex="0"></span> 
    <label for="aria-chexkbox_01"></label> 
<form>

是否有效將for屬性更改爲鏈接自定義元素？

來源

2016-10-17 John

組<標籤= 「checkbox_01」>到您的輸入元件鏈接。你想要嗎？ – mymotherland

不，我想讓te本地複選框來存儲用戶的響應，但我想使用可觸摸（sapn）元素有一個接口。 – John

對不起：不，我想保留本地複選框來存儲用戶響應，但我想使用一個可觸摸的元素（跨度）作爲接口。 – John

如果指定了屬性編號

，該屬性的值必須在相同的文獻作爲標籤元件的貼標籤的元素的ID。

- https://www.w3.org/TR/html5/forms.html#attr-label-for

一些元素，並不是所有的形式相關，被歸類爲貼標籤的元素。這些元素可以與標籤元素相關聯。

按鈕輸入（如果該類型屬性不是處於隱藏狀態）密鑰生成米輸出進度選擇的textarea

- https://www.w3.org/TR/html5/forms.html#category-label

甲跨度不是貼標籤的元素。

來源

2016-10-17 09:16:21 Quentin

你只需要測試你的代碼。

正如你所看到的，for屬性失去了他的功能，如果你點擊標籤，複選框沒有被選中。

所以你必須有相同的for和id屬性，在label/input

<input type="checkbox" id="checkbox_01" value="1" aria-hidden="true" /> 
 
<span role="checkbox" id="aria-checkbox_01" aria-checked="false" tabindex="0"></span> 
 
<label for="aria-chexkbox_01">Click on label must check the checkbox</label>

來源

2016-10-17 09:16:38 Alexis

謝謝亞歷克西斯，我做了這個改變，因爲複選框的詠歎調隱藏的屬性，重點是由JavaScript點擊標籤。我必須重新考慮我的插件... – John

注意：這裏的問題並不是真正的點擊標籤不會檢查非本地複選框（這可以完美地使用腳本完成），但是聚焦此「role = checkbox」元素的事實不會檢索可訪問的描述元素。 – Adam

你必須使用aria-labelledby達到你想要的東西：

<form> 
<span role="checkbox" aria-labelledby="aria-label" aria-checked="false" tabindex="0"></span> 
<span id="aria-label">Label</label> 
</form>

的label元素保留給一些本地人形式元素：

buttoninput（如果該類型屬性不是處於隱藏狀態）keygenmeteroutputprogressselecttextarea

來源

2016-10-17 12:19:29 Adam

使用屬性「的」鏈接

回答

相關問題