RadioBOX와 Label의 포함관계 <선택된 Value의 Text값 가져오기>

<input type="radio" name="searchYn" id="searchYn1" value=""/> 사용

 

<input type="radio" name="searchYn" id="searchYn1" value=""/> 
<label for="searchYn1">사용</label>

 

input 태그와 label 태그를 연동시키지 않으면 "사용" 텍스트를 눌렀을 때 라디오 버튼이 선택되지 않는다.

 

연동시키는 방법

1) label 태그로 input 태그를 감싸는 방법

2) label 태그에 input의 ID를 지정해주는 방법

 

label 태그는 input 태그를 제어하여 상태를 변경하게 도와주는 태그로서, 클릭시 유효범위 정도 라고 정의한다.

다시말해 라디오선택 동그라미를 클릭하지 않고 Label로 감싸준 Text를 클릭해도 원하는 라디오동그라미에 체크가 된다.

 

label에 for 속성을 사용할 경우 부모 input 요소의 id명과 같은 값을 선언해야한다.

 

Label의 text를 가져오기 위해서는 다음과같이 사용한다.

$("input[name=searchYn]:checked").next().text();

위와 같이 선언하면 현재 선택된 라디오박스 요소 객체의 next 즉 하위객의 text()를 가져온다.