> 웹 프론트엔드 > JS 튜토리얼 > JavaScript_Form 특수 효과에서 선택한 라디오 값을 가져옵니다.

JavaScript_Form 특수 효과에서 선택한 라디오 값을 가져옵니다.

WBOY
풀어 주다: 2016-05-16 15:32:41
원래의
1325명이 탐색했습니다.

원칙은 다음과 같습니다. 일반적으로 순회 방법을 사용하여 각 라디오가 선택되었는지 확인하고 선택한 경우 해당 값을 가져옵니다.

<form id="userlist" method="post" action="option.php">
<input type="radio" name="userid" value="1">1
<input type="radio" name="userid" value="2">2
<input type="radio" name="userid" value="3">3
</form>
<script language="javascript">
function usubmit(action){
var radionum = document.getElementById("userlist").userid;
for(var i=0;i<radionum.length;i++){
if(radionum[i].checked){
userid = radionum[i].value
}
}
window.location.href='option.php&#63;action='+action+'&userid='+userid;
}
</script>
로그인 후 복사

위의 형태로 id(userlist)가 설정되어 있으니 참고하세요

여기서 주목해야 할 두 가지가 있습니다. 하나는 값을 얻는 방법이고 다른 하나는 순회하는 방법입니다.
document.getElementById("userlist").userid;
폼의 id를 기준으로 컨트롤 요소의 이름 값을 가져오는 방식입니다.
document.getElementsByName("userid")를 사용하여

를 직접 얻을 수도 있습니다.

getElementById와 getElementsByName의 차이점. GetElementById는 라디오 유형 요소를 선택할 때 단일 컨트롤만 선택할 수 있습니다. getElementsByName이 라디오 유형 요소를 선택할 때 getElementById를 사용해야 하는 경우 먼저 사용할 수 있습니다. 위 코드와 같이 getElementById를 사용하여 전체 양식의 ID를 얻고 그 뒤에 라디오 이름

이 옵니다.

이제 document.getElementsByName("userid")이 배열을 가져오는 것임을 알았습니다. 배열의 요소는 DOM 트리에 radionum이라는 이름이 있는 모든 요소입니다. 요소가 하나만 포함된 배열입니다.
Document.all.userid는 페이지의 userid 요소에 대한 참조를 가져옵니다. 페이지에 라디오가 여러 개 있는 경우 배열을 반환합니다. 페이지에 라디오가 하나만 포함되어 있으면 이 라디오가 표시됩니다. 객체 참조. 이때 얻는 것은 배열이 아니기 때문에 배열을 순회하여 판단할 수는 없습니다.

은 다음과 같은 함수로 만들어졌습니다.

function  getRadioBoxValue(radioName) 
{ 
      var obj = document.getElementsByName(radioName); //这个是以标签的name来取控件
         for(i=0; i<obj.length;i++)  {

         if(obj[i].checked)  { 
             return  obj[i].value; 
         } 
       }     
       return "undefined";    
}
로그인 후 복사

JS가 라디오에서 선택된 값을 얻습니다

function Foo()
{
  var selectedIndex = -1;
  var form1 = document.getElementById("form1");
  var i = 0;
  
  for (i=0; i<form1.r.length; i++)
  {
    if (form1.r[i].checked)
    {
      selectedIndex = i;
      alert("您选择项的 value 是:" + form1.r[i].value);
      break;
    }
  }
  
  if (selectedIndex < 0)
  {
    alert("您没有选择任何项");
  }
}
로그인 후 복사
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿