HTML_HTML/Xhtml_Web 페이지 제작 시 라디오 값에 대한 이벤트 획득, 할당, 등록 예제에 대한 자세한 설명

1. 라디오 그룹화

이름만 같으면 그룹입니다. 즉, 그룹 내에서 하나만 선택할 수 있습니다.

코드 복사

코드는 다음과 같습니다.

group1:
radio1
radio2
radio3

group2:
radio4
radio5
< ;input type="radio" id="radio6" name="group2" />radio6

효과는 다음과 같습니다.


2. 선택한 라디오 노드 가져오기

jquery를 사용하는 것은 매우 쉽습니다. 더 쉽게 하려면 먼저 그룹을 선택한 다음 다음과 같이 선택된 항목을 필터링하세요.

코드 복사

코드는 다음과 같습니다.

var group1 = $("[name='group1']" ).filter(":checked");
console.log(group1.attr("id"))

3, 라디오 노드 선택

jquery 사용 확인된 속성을 설정하려면:

코드 복사

코드는 다음과 같습니다.

$("#radio2").attr("checked", "checked");

4, 체크된 속성을 제거하려면

라디오 노드를 선택하세요.

코드를 복사하세요

코드는 다음과 같습니다:

$("#radio1"). RemoveAttr("checked");

그 결과 그룹의 라디오가 하나도 선택되지 않을 수 있습니다.

5. 선택 및 선택 취소 이벤트 등록

또는 다음과 같이 jquery의 on 함수를 사용하여 변경 이벤트를 등록합니다.

코드 복사

코드는 다음과 같습니다.

$("[name='group1']").on("change",
function (e) {
console.log($(e.target).val());
}
)

이런 식으로 그룹 1의 어느 하나를 선택하면 기능이 실행됩니다.