手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >js获取单选框或复选框值及操作
js获取单选框或复选框值及操作
摘要:复制代码代码如下:functioncheckbox(){varstr=document.getElementsByName("box");v...

复制代码 代码如下:

<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>

<>

选择您的爱好:

<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" 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>

<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" >提交</button>

</div>

<div>

<input type="checkbox" value="前年"/><label>前年</label>

<input type="checkbox" value="去年"/><label>去年</label>

<input type="checkbox" value="今年" /><label>今年</label>

<input type="checkbox" value="明年"/><label>明年</label>

<input type="checkbox" value="后年"/><label>后年</label>

<button type="button" >提交</button>

<button type="button" >全选</button>

<button type="button" >反选</button>

<button type="button" >全不选</button>

</div>

</body>

</html>

【js获取单选框或复选框值及操作】相关文章:

javascript实现链接单选效果

js获取字符串字节数方法小结

javascript实现可全选、反选及删除表格的方法

javascript实现简单的进度条

jquery控制表单输入框显示默认值的方法

获取对象

父窗口获取弹出子窗口文本框的值

jQuery实现给页面换肤的方法

jQuery切换所有复选框选中状态的方法

js获取变量

精品推荐
分类导航