復制代碼 代碼如下:
<script>
function checkbox()
{
var str=document.getElementsByName("box");
var objarray=str.length;
var chestr="";
for (i=0;i<objarray;i++)
{//歡迎來到，我們的網址是www.jb51.net，很好記，，js就是js特效，本站收集大量高質量js代碼，還有許多廣告代碼下載。
if(str[i].checked == true)
{
chestr+=str[i].value+",";
}
}//歡迎來到，我們的網址是www.jb51.net，很好記，，js就是js特效，本站收集大量高質量js代碼，還有許多廣告代碼下載。
if(chestr == "")
{
alert("請先選擇一個愛好～！");
}
else
{
alert("您先擇的是："+chestr);
}
}
</script>
<a href="<#ZC_BLOG_HOST#>"></a>,站長必備的高質量網頁特效和廣告代碼。zzjs.net，站長js特效。<hr>
<!--歡迎來到，我們網站收集大量高質量js特效，提供許多廣告代碼下載，網址：www.jb51.net，,用.net打造靓站-->
選擇您的愛好：
<input type="checkbox" name="box" id="box1" value="跳水" />跳水
<input type="checkbox" name="box" id="box2" value="跑步" />跑步
<input type="checkbox" name="box" id="box3" value="聽音樂" />聽音樂
<input type="button" name="button" id="button" onclick="checkbox()" value="提交" />
復制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="all">
label{
cursor:pointer;
font-size:12px;
margin:0px 2px 0px 0px;
color:#2B86BD;
}
.d0{
margin-bottom:30px;
}
.d0 input{
cursor:pointer;
margin:0px;
padding:0px 2px;
}
</style>
<script language="javascript" type="text/javascript">
var dr=document.getElementsByTagName("div"),i,t="";
function submit1(num,type){
t="";
var dri=dr[num].getElementsByTagName("input");
for(i=0;i<dri.length;i++){
if(dri[i].checked){
if(type==0){
alert(dri[i].value);
break;
}else{
t=t+dri[i].value+";";
}
}
}
if(type==1) alert(t);
}
//ChangeSelect
submit1.allselect=function(){
var drc=dr[1].getElementsByTagName("input");
for(i=0;i<drc.length;i++){
drc[i].checked=true;
}
}
//allNot
submit1.allNot=function(){
var drc=dr[1].getElementsByTagName("input");
for(i=0;i<drc.length;i++){
drc[i].checked=false;
}
}
//reverse
submit1.reverseSelect=function(){
var drc=dr[1].getElementsByTagName("input");
for(i=0;i<drc.length;i++){
if(drc[i].checked){
drc[i].checked=false;
}else{
drc[i].checked=true;
}
}
}
</script>
<title>js獲取單選框、復選框的值及操作</title>
</head>
<body>
<div class="d0">
<input type="radio" name="day" id="r0" value="前天"/><label for="r0">前天</label>
<input type="radio" name="day" id="r1" value="昨天"/><label for="r1">昨天</label>
<input type="radio" name="day" id="r2" checked="checked" value="今天"/><label for="r2">今天</label>
<input type="radio" name="day" id="r3" value="明天"/><label for="r3">明天</label>
<input type="radio" name="day" id="r4" value="後天"/><label for="r4">後天</label>
<button type="button" onclick="submit1(0,0)" >提交</button>
</div>
<div>
<input type="checkbox" value="前年" onclick="alert(this.value);"/><label>前年</label>
<input type="checkbox" value="去年" onclick="submit1(1,1);"/><label>去年</label>
<input type="checkbox" value="今年" /><label>今年</label>
<input type="checkbox" value="明年"/><label>明年</label>
<input type="checkbox" value="後年"/><label>後年</label>
<button type="button" onclick="submit1(1,1)" >提交</button>
<button type="button" onclick="submit1.allselect()" >全選</button>
<button type="button" onclick="submit1.reverseSelect()" >反選</button>
<button type="button" onclick="submit1.allNot()" >全不選</button>
</div>
</body>
</html>