用 Javascript 验证表单（form）中多选框（checkbox）的值

最新推荐文章于 2024-01-31 16:21:47 发布

yanleigis

最新推荐文章于 2024-01-31 16:21:47 发布

阅读量1.3k

点赞数

分类专栏： javascript html web 文章标签： javascript input button function action c

本文链接：https://blog.csdn.net/yanleigis/article/details/3237572

版权

javascript 同时被 2 个专栏收录

67 篇文章 0 订阅

订阅专栏

html web

40 篇文章 0 订阅

订阅专栏

本文介绍了一种使用JavaScript来获取HTML表单中多选框（checkbox）值的方法。通过自定义函数getCheckboxValue，可以有效地收集并返回所有被选中的选项值。此外，还提供了一个按钮点击事件来展示如何应用这一功能。

摘要由CSDN通过智能技术生成

<form name="form1" method="post" action="">
<p>
    <input name="checkbox" type="checkbox" value="汗珠子" checked>net
    <input name="checkbox" type="checkbox" value="汉字">wps
</p>
<input name="nnn" type="button" value="点此获取值" onClick="alert(getCheckboxValue(this.form.elements['checkbox']))">
<input type="button" name="Submit2" value="获取值"οnclick="myclick(s30c_tbl0_xja_男_女)">
<input name="s30c_tbl0_xja_男_女" type="hidden" value="">
<p>  </p>
<p> </p>
</form>
<script type="text/javascript"> // 说明：用 Javascript 验证表单（form）中多选框（checkbox）的值 // 作者： CodeBit.cn ( http://www.CodeBit.cn )
function myclick(obj) {
alert(obj.value);
}
function getCheckboxValue(checkbox) {
   alert(checkbox.length);
    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;
        }
    }
var str=(val.length)?val:'';
document.all['s30c_tbl0_xja_男_女'].value=str;
    return str;
}
</script>