当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 用 Javascript 验证表单(form)中多选框(checkbox)值

Javascript
玩透弹出窗口
几个常用的日期函数
简单的脚本帮你编排JScript程序中的缩进
得到 words.js?hello,world! 参数的处理方法
如何在javascript中传值
可输入的select
IE支持的HTML元素的DISABLE属性在NETSCAPE4.76中的实现
利用xml数据岛实现多级关联下拉选择框的做法
利用Wipe等ActiveX技术,实现n(n>>2)幅图片轮换擦洗显示
Javascript技术实现真正的网上试听
JavaScript实现在线编辑表格
根据客户端的分辨率不同而重定向到不同网页的脚本
几种不刷新页面取数据的方法
web进度条
随手写的一个动态添加删除行的HTC行为组件
农历与阳历的对照
关于在页面中解决打印的几个问题
"打开,另存为,属性,打印"等14个JS代码
无提示框关闭IE窗口
实现上传(增删)多个文件的客户端写法。

用 Javascript 验证表单(form)中多选框(checkbox)值


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 117 ::
收藏到网摘: n/a

和单选框一样,许多新手在用 Javascript 验证表单(form)中多选框(checkbox)的值时,都会遇到问题,原因是 checkbox 和普通的文本框在获取值的时候有很大不同 本文介绍了一个较为通用的获取 checkbox 值的方法,希望对新手有用。
复制代码 代码如下:

<script type="text/javascript">
// 说明: 用 Javascript 验证表单(form)中多选框(checkbox)的值
// 作者: CodeBit
function getCheckboxValue(checkbox)
{
if (!checkbox.length && checkbox.type.toLowerCase() == 'checkbox')
{ return (checkbox.checked)?checkbox.value:''; }
if (checkbox[0].tagName.toLowerCase() != 'input' ||
checkbox[0].type.toLowerCase() != 'checkbox')
{ return ''; }
var val = [];
var len = checkbox.length;
for(i=0; i<len; i++)
{
if (checkbox[i].checked)
{
val[val.length] = checkbox[i].value;
}
}
return (val.length)?val:'';
}
</script>

和 radio 一样,都是 name 相同,值有多个,在获取 checkbox 值的时候,我们不能按照普通文本框 .value 的方式,而是要判断哪个被选中了。
当一组 checkbox 有多个选项时,我们可以通过循环,以 checkbox[i] 的方式判断某个选项是否被选中来返回值,但是当一组 checkbox 只有一个选项时,获取值的方式又有变化,代码中以 (checkbox.checked)?checkbox.value:''; 的方式直接判断是否选中,然后返回对应值。
上面的代码传入的参数是 checkbox 对象,如:
复制代码 代码如下:

var checkboxTest = document.forms['testForm'].elements['checkboxTest'];
if (getCheckboxValue(checkboxTest) == '')
{ ...... }

根据判断结果执行你想要的操作。