Html 라디오버튼 값 넘기기 - html ladiobeoteun gabs neomgigi

Program/html

2011. 5. 31. 15:01

form이름 등을 모를때 자주 사용하는 방식이다.
또한 radio는 id를 같게 줄수 없으므로 될수 있으면 이름으로 검색을 하여 사용을 하자.

아래와 같이 체크를 하면 쉽게 해결이 될것이다.
쉬운 테그 이지만 가끔 제가 까먹어서 올려 놨습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Transitional.dtd">
<html>
<head>
<title></title>
<script type="text/javascript">
function test_sample(){
var sample = document.getElementsByName('flower');

for(var i=0;i<sample.length;i++){
  if(sample[i].checked == true){
   alert(sample[i].value);
  }
}
}
</script>
</head>

라디오 버튼

라디오버튼의 기본 폼과 선택, 해제, 선택된값 불러오기 등을 정리해보겠습니다.

1) 라디오버튼 기본 폼

<div>

<input type="radio" id="one" name="number" value="1" checked>One

<input type="radio" id="two" name="number" value="2">Two

<input type="radio" id="three" name="number" value="3">Three

<input type="radio" id="fore" name="number" value="4">Four

</div>

코드 실행 결과 화면

위의 코드는 라디오 버튼의 기본 폼과 코드 실행 결과입니다.

<input> 태그에 type값을 radio로 설정해주면 라디오버튼이 생성되게 됩니다.

그 다음 name값을 지정해주고 value값을 지정해주어 radio버튼을 컨트롤 해줄 수 있습니다.

2) 라디오 버튼 선택/해제

이제 라디오 버튼의 기본 폼을 알아봤으니, 선택/해제 동작을 알아보겠습니다.

<div>

<input type="radio" id="one" name="number" value="1" checked>One

<input type="radio" id="two" name="number" value="2">Two

<input type="radio" id="three" name="number" value="3">Three

<input type="radio" id="four" name="number" value="4">Four

</div>

// 라디오버튼 Three 체크

$("#three").prop("checked", true);

// 라디오버튼 Three 체크 해제

$("#three").prop("checked", false);

</script>

위의 코드는 각각 Jquery로 원하는 라디오 버튼을 체크, 해제하는 방법입니다.

라디오버튼 체크

$("#라디오버튼 ID").prop("checked", true);

라디오버튼 체크해제

$("#라디오버튼 ID").prop("checked", false);

라디오버튼의 체크와 체크해제를 위와같이 해주면 됩니다.

3) 라디오 버튼 선택된 값 조회

var checkVal = $('input[name=number]:checked').val(); // 체크된 라디오버튼 value 값

위의 코드는 라디오 버튼 중 체크된 라디오버튼의 value값을 조회해오는 코드입니다.

라디오버튼 체크된 value값 조회

$('input[name=라디오버튼 name]:checked').val();

위와같이 체크된 값을 조회할 수 있습니다.

라디오버튼에 관한 피드는 이쯤에서 마무리하겠습니다.

Html 라디오버튼 값 넘기기 - html ladiobeoteun gabs neomgigi

라디오 버튼

관련 게시물

아이클라우드 사진 백업 - aikeullaudeu sajin baeg-eob

메타마스크 모바일 동기화 qr코드 - metamaseukeu mobail dong-gihwa qrkodeu

웹 페이지 css - web peiji css

액세스 외부 데이터 가져 오기 - aegseseu oebu deiteo gajyeo ogi

금융인증서 pc 저장 국민은행 - geum-yung-injeungseo pc jeojang gugmin-eunhaeng

라디오 버튼 줄 바꿈 - ladio beoteun jul bakkum

유니티 레이어 비교 - yuniti leieo bigyo

크롬 비밀번호 추가 - keulom bimilbeonho chuga

Jquery text 가져오기 - jquery text gajyeoogi

광고하는

최근 소식

Lg 클립보드 복구 - lg keullibbodeu boggu

세 레비 잡는 법 - se lebi jabneun beob

마세라티 콰트로포르테 풀체인지 - maselati kwateulopoleute pulcheinji

브라질리언 레이저 제모 병원 추천 - beulajillieon leijeo jemo byeong-won chucheon

딸기 씨 키우기 - ttalgi ssi kiugi

스타듀밸리 마우스 오류 - seutadyubaelli mauseu olyu

마우스 자동클릭 설정 - mauseu jadongkeullig seoljeong

갤럭시 A31 단점 - gaelleogsi A31 danjeom

실비 키우기 pc 다운로드 - silbi kiugi pc daunlodeu

식단 조절 없이 근력 운동 - sigdan jojeol eobs-i geunlyeog undong

광고하는

포퓰러

광고하는

에 대한

합법적인

돕다

사회의