通过JS代码如何获取复选框的选择项

2012/11/1 20:09:07作者：佚名来源：网络

移动端

【实例名称】

通过JS代码如何获取复选框的选择项

【实例描述】

复选框由多个checkbox构成。本例学习如何判断用户的选择，并获取用户的选择值。

【实例代码】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>标题页-学无忧（www.xue51.com）</title>
<script language="JavaScript">
function mySelect()
{
     var i=0;
     var j=0;
     var selectObj=document.getElementsByName("love");
     //遍历复选框的选择
    for (i=0;i<selectObj.length;i++) {
        if (selectObj[i].checked) {
          j=1;
          break;
        }
    }
    if (j!=1) {
      alert("请选择至少一种爱好！")
         return false;
    }
    alert(selectObj[i].value);//显示所选择的第一项的内容
}
</script>
</head>
<body>
<form name="form1">
<input type="checkbox" name="love" value="旅游" >旅游
<input type="checkbox" name="love" value="体育" >体育<br/>
<input type="checkbox" name="love" value="购物" >购物
<input type="checkbox" name="love" value="影视" >影视
<input type="checkbox" name="love" value="音乐" >音乐
<input type="button" value="我的选择" onclick="mySelect()">
</form>
</html>

【运行效果】

获取复选框的选择项运行效果