JS如何获取表单中复选框的值?

JavaScript06

JS如何获取表单中复选框的值?,第1张

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <script>

        function f1() {

            //获取所有name为chk的多选框,返回一个多选框数组

            var chks = document.form.chk

            //把选中的多选框的值拼接成字符串

            var str = ""

            //循环多选框数组

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

                //如果多选框被选中,则把值累计到str中

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

                    str += chks[i].value + ","

                }

            }

            //弹出多选框选中的结果

            alert("您勾选的值是:"+str)

        }

    </script>

</head>

<body>

    <form name="form">

        <input type=checkbox name="chk" value=1>

        <input type=checkbox name="chk" value=2>

        <input type=checkbox name="chk" value=3>

        <input type="button" value="测试" onclick="f1()"/>

    </form>

</body>

</html>

有两种方法:

1、方法一HTML结构如下:

2、方法二javascript代码如下:

3、显示效果如下:

js获得多个checkbox选中的值的方法:

一、代码如下:

二、后台获得参数为:

//获得的均为数组值:

String checboxValues=request.getParameter("checboxValue")

String checboxTexts=request.getParameter("checboxText")

//得到每个具体值:

String checboxValue=checboxValues.split(",")

String checboxText=checboxTexts.split(",")

三、备注:

nextSibling是获得当前对象的下一个对象,nodeValue是返回一个节点的值

使用该方法必须保证文本值在input后面,否则checkboxStr[i].nextSibling.nodeValue获取不到文本值