티스토리 뷰

체크박스[2] 체크가 되어있는지 안되었는지

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Checkbox Demo</title>
<script type="text/javascript">
 
function display() {
    var checkboxes = document.getElementsByName("choices");
    var msgDiv = document.getElementById("msg");         
    var array = new Array();
 
    for(var i=0; i<checkboxes.length; i++) {
      msgDiv.innerHTML='';               
      if(checkboxes[i].checked) {
          array.push(checkboxes[i].value);
      }
    }
 
    if (array.length > 0) {
      for (var i = 0; i < array.length; i++) {          
          var tempDiv = document.createElement("div");
          tempDiv.innerHTML = array[i];
          msgDiv.appendChild(tempDiv);
      }
    }  
}
 
</script>
</head>
<body>
<input name="choices" type="checkbox" value="one" id="one" />
<label for="one">one</label>
<input name="choices" type="checkbox" value="two" id="two" />
<label for="two">two</label>
<input name="choices" type="checkbox" value="three" id="three" />
<label for="three">three</label>
<input name="choices" type="checkbox" value="four" id="four" />
<label for="four">four</label>
<input type="button" value="Display" onclick="display();">

<h2>You selected ... </h2>
<div id="msg"></div>                     
</body>
</html>


[출처] JavaScript 체크박스|작성자 hsolomol

'WEB > JavaScript' 카테고리의 다른 글

Jquery 다운 받기  (0) 2011.10.11
value 와 text, 그리고 innerHTML  (1) 2011.10.11
input 박스 한글입력, 영어입력, 숫자입력, 막기  (0) 2011.10.11
Javascript 다중셀렉트 처리  (1) 2011.10.11
Javascript[필수]강의  (0) 2011.10.11