您的位置：首页 > Web前端 > JavaScript

JS checkbox 选中事件

2012-05-11 09:04 211 查看

<html>
<script>
function SelectLeastOne(){
objName= document.getElementById("myform")
for (i=0; i<objName.length; i++){
if (objName[i].type=="checkbox" && objName[i].checked){
alert('你选中了'+(i+1));
}
}
}
</script>
<form name="myform" method="post" onSubmit="">
<input type="checkbox" name="checkbox" value="checkbox">1
<input type="checkbox" name="checkbox" value="checkbox">2
<input type="checkbox" name="checkbox" value="checkbox">3
<input type="checkbox" name="checkbox" value="checkbox">4
<input type="button" name="Submit" value="Submit" onclick="SelectLeastOne()" />
</form>
</html>

今天做一个类似邮件的多选操作时用到了复选框，有关验证与取值以前也做过，记的不是很清楚了，今天弄清白了，记录一下。

表单如下：

<form name="form1" action="test.jsp" method="post" onsubmit="return checkData();">

<input name="checkall1" type="checkbox" value="0" onClick="checkAllBox(this);"/>全选<br>

<input name="answer" type="checkbox" value="a"/>A<br>

<input name="answer" type="checkbox" value="b"/>B<br>

<input name="answer" type="checkbox" value="c"/>C<br>

<input name="answer" type="checkbox" value="d"/>D<br>

<input name="answer" type="checkbox" value="e"/>E<br>

<input name="answer" type="checkbox" value="f"/>F<br>

</form>

全选及验证javascript如下：

<script type="text/javascript">

function checkAllBox(obj){

var answer= document.getElementsByName("answer");

if(obj.checked==true){

for(var i=0;i<answer.length;i++){

answer[i].checked = true;

}

}else{

for(var i=0;i<answer.length;i++){

answer[i].checked = false;

}

}

}

function checkData(){

var answer= document.getElementsByName("answer");

var flag = false;

for(var i=0;i<income.length;i++){

if(income[i].checked == true){

flag = true;

break;

}

}

if(!flag){

alert("请至少选择一项");

}

return flag;

}

</script>

test.jsp中取值如下：

String[] answer= request.getParameterValues("answer");//这里只取得了选中的项，如果没有选中任何一项，则为null

if(answer!=null){

for(String i:answer){

System.out.println(i);

}

}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航