使用JavaScript实现checkbox复选

    这个问题在在管理信息系统中我们经常会遇到,我以前做的程序都是使用后台代码来获得用户的选择项,为了提高页面效率,使用JavaScript会更好一些。
    下面是javascript写的一个函数:
   
<script language="JavaScript" type="text/javascript">
function btn_Check_onclick()
{
  
var myElement;
  
var numberOfControls=document.form1.length;
  
var compSpec="Your chosen language is  ";
  
for(var i=0;i<numberOfControls;i++)
  
{
    myElement
=document.form1[i];
    
if(myElement.type=="checkbox")
    
{
      
if(myElement.checked==true)
      
{
        compSpec
+=myElement.value+" ";
      }

    }

  }

  alert(compSpec);
}

</script>

    在页面上定义了三个checkbox控件,如下:
<html>
<head>
</head>
<body>
<form name="form1">
<div>
<h1>Please choice your language:</h1>
<br/>
<p>
<table>
  
<tr>
    
<td>Java</td>
    
<td><input type="checkbox" name="chk_Java" value="Java"></td>
  
</tr>
  
<tr>
    
<td>C#</td>
    
<td><input type="checkbox" name="chk_c#" value="cSharp"></td>
  
</tr>
  
<tr>
    
<td>Python</td>
    
<td><input type="checkbox" name="chk_Python" value="Python"></td>
  
</tr>
  
<tr>
    
<td><input type="button" name="btn_Check" value="Sub_Check" onclick="return btn_Check_onclick()"></td>
  
</tr>
</table>
</p>
</div>
</form>
</body>
</html>

    从中我们可以看出,btn_Check_onclick()的工作原理就是在“from”这个数组中逐个判断页面元素,是不是“checkbox”类型的,如果是,则进一步判断checkbox元素是否被选中。

posted on 2008-03-31 20:40  跋涉ing的小马哥  阅读(481)  评论(0编辑  收藏  举报

导航