숨길 때 확인란의 레이블이 숨겨지지 않는 이유는 무엇입니까?

Question

나는 확인란이 있습니다

<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(); 

어떤 코드 나 체크 박스의 텍스트를 숨길 필요합니까?

Answer 1

내가 아는 한, <input/>은 그런 내부 텍스트를 지원하지 않습니다. <input> on MDN :

허용되는 콘텐츠 - 없음.

당신이 사용하는 어떤 브라우저를 라벨로 표시 될 수 있지만

, 당신은 아마 당신의 레이블 실제 <label>을 사용하고 싶습니다.

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

Answer 2

입력 태그가 자동으로 닫힙니다. 체크 박스의 경우 value 속성이 숨겨집니다. 그래서 당신은 참으로 입력 태그 후 라벨 작성합니다

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

이 경우를, 당신은 즉 span 태그, 컨테이너에 물건을 포장하거나 필요하거나 레이블의 텍스트를 바꿈.

Answer 3

이 시도 :

는

<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()