Document getElementsByName() Method 유효성 체크 > 기술자료

• 목록
• 게시판 리스트 옵션
  • 검색

Definition and Usage
The getElementsByName() method accesses all elements with the specified name.

Syntax
document.getElementsByName(name)

Parameter : name
Description : Required. The name of the element you want to access/manipulate


사용예.1
<script type="text/javascript">
var x=document.getElementsByName("xxx");
 alert(x.length);
</script>


사용예.2 ( 2개의 radio 값중 첫번째항목을 꼭 선택하도록 할때, 유효성 체크 )
<script type="text/javascript">
  function input_check(hpform) {
    var radio1= document.getElementsByName("xxx");
    if (!radio1[0].checked) {
        alert("회원가입약관에 동의하셔야 회원가입 하실 수 있습니다.");
        radio1[0].focus();
        return false;
    }
  }
</script>

<form name="hpform" action="happyjung_com.html" enctype="multipart/form-data" method="post">
  <input type="radio" name="xxx" value="yes">예
  <input type="radio" name="xxx" value="no">아니오
  <input type="image" src="img/btn_ok.gif" border=0 onclick="return input_check();">
</form>


사용예.3 ( 3개의 radio 값중 선택시키기, 유효성 체크 )
<script type="text/javascript">
  function input_check(hpform) {
    // 방법1
    var radio2 = document.getElementsByName("네임");
    if (!radio2[0].checked && !radio2[1].checked && !radio2[2].checked) {
      alert("참여경로를 선택해주세요.");
      return false;
    }

    // 방법2
    var radio3 = document.폼['네임'];
    if(radio3[0].checked==false && radio3[1].checked==false && radio3[2].checked==false){
      alert('참여경로를 선택해주세요.');
      return false;
    }

    // 방법3
    var radio4 = 0;
    var radio4n = document.폼['네임'];
    for(var i=0; i<radio4n.length; i++){
      if(radio4n[i].checked==true) {
        radio4 = 1;
        break;
      }
    }
    if(radio4 == 0){
      alert('참여경로를 선택해주세요.');
      return false;
    }
  }
</script>

<form name="폼" action="happyjung_com.html" method="post">
  <input type="radio" name="네임" value="1">선택1
  <input type="radio" name="네임" value="2">선택2
  <input type="radio" name="네임" value="3">선택3
  <input type="image" src="img/btn_ok.gif" border=0 onclick="return input_check();">
</form>


참고사이트
http://www.phpschool.com/gnuboard4/bbs/board.php?bo_table=qna_html&wr_id=70164 
http://www.w3schools.com/jsref/met_doc_getelementsbyname.asp 
http://www.mungchung.com/xe/lecture/4197