Có thể liên kết nhãn với hộp kiểm mà không sử dụng "for = id"?

Question

Tôi biết rằng nó là tốt đôi khi kết hợp một nhãn với một hộp kiểm:

<input id="something" type="checkbox" value="somevalue" /> 
<label for="something">this is label text</label> 

..nhưng tôi có sử dụng một id để liên kết nó?
Lý do chính tôi thậm chí quan tâm là bởi vì tôi thích có thể nhấp vào nhãn để chuyển đổi giá trị hộp kiểm, nhưng không thích ý tưởng sử dụng id cho một cái gì đó rất đơn giản.

Tôi đoán tôi có thể sử dụng jQuery chuyển đổi phần tử trước (hộp kiểm) của nhãn được nhấp vào, nhưng có thể có điều gì đó đơn giản hơn tôi bị thiếu. https://stackoverflow.com/a/2720771/923817 trông giống như một giải pháp, nhưng người dùng cho biết nó không hoạt động trong IE.

Answer 1

Có, đặt đầu vào bên trong nhãn.

<label><input type=checkbox name=chkbx1> Label here</label> 

Xem implicit label association trong thông số kỹ thuật HTML.

Answer 2

<label for="something">this is label text</label> 
<input id="something" type="checkbox" value="somevalue" /> 

thực sự cho thuộc tính được sử dụng cho trình đọc màn hình để người tàn tật, vì vậy không có ích cho khả năng tiếp cận để viết mà không cho thuộc tính

Answer 3

Demo: JsFiddle

.c-custom-checkbox { 
 
    padding-left: 20px; 
 
    position: relative; 
 
    cursor: pointer; 
 
} 
 
.c-custom-checkbox input[type=checkbox] { 
 
    position: absolute; 
 
    opacity: 0; 
 
    overflow: hidden; 
 
    clip: rect(0 0 0 0); 
 
    height: 15px; 
 
    width: 15px; 
 
    padding: 0; 
 
    border: 0; 
 
    left: 0; 
 
} 
 
.c-custom-checkbox .c-custom-checkbox__img { 
 
    display: inline; 
 
    position: absolute; 
 
    left: 0; 
 
    width: 15px; 
 
    height: 15px; 
 
    background-image: none; 
 
    background-color: #fff; 
 
    color: #000; 
 
    border: 1px solid #333; 
 
    border-radius: 3px; 
 
    cursor: pointer; 
 
} 
 
.c-custom-checkbox input[type=checkbox]:checked + .c-custom-checkbox__img { 
 
    background-position: 0 0; 
 
    background-color: tomato; 
 
}

<label class="c-custom-checkbox"> 
 
    <input type="checkbox" id="valueCheck" /> 
 
    <i class="c-custom-checkbox__img"></i>Some Label 
 
</label>