Javascript选择checkbox

最新推荐文章于 2021-09-06 18:51:00 发布

weixin_33937778

最新推荐文章于 2021-09-06 18:51:00 发布

阅读量74

点赞数

文章标签： javascript xhtml ViewUI

主要功能：

1、Javascript获取选中的checkbox;

2、Javascript实现页面结构与行为分离。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        window.onload = function () {
            document.getElementById("btnOperate").onclick = function () {
                var arr = new Array();
                var items = document.getElementsByName("category");

                for (i = 0; i < items.length; i++) {
                    if (items[i].checked) {
                        arr.push(items[i].value);
                    }
                }

                alert("选择的个数为：" + arr.length);
            };
        };
    </script>
</head>
<body>
    <input type="checkbox" name="category" value="今日话题" />
    <input type="checkbox" name="category" value="视觉焦点" />
    <input type="checkbox" name="category" value="财经" />
    <input type="checkbox" name="category" value="汽车" />
    <input type="checkbox" name="category" value="科技" />
    <input type="checkbox" name="category" value="房产" />
    <input type="checkbox" name="category" value="旅游" />
    <input id="btnOperate" type="button" value="选择" />
</body>
</html>