js动态设置复选框限选确定个数

最新推荐文章于 2022-11-03 16:19:59 发布

努力学习的阿奇

最新推荐文章于 2022-11-03 16:19:59 发布

阅读量1.1k

点赞数

分类专栏： js html 文章标签： js 复选框 checkbox checkbox限选复选框限选

本文链接：https://blog.csdn.net/qq_43302195/article/details/89180282

版权

js 同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

html

3 篇文章 0 订阅

订阅专栏

js设置复选框限选两个

这里我们以最多选两个为例子

假如我们这边有5个复选内容

<html>
<head>
</head>
<body>

<form>
<input type="checkbox" value="value1" name="item" onClick="onCheckBox(this);"/> 选项一 
<br>
<input type="checkbox" value="value2" name="item" onClick="onCheckBox(this);"/> 选项二 
<br>
<input type="checkbox" value="value3" name="item" onClick="onCheckBox(this);"/> 选项三 
<br>
<input type="checkbox" value="value4" name="item" onClick="onCheckBox(this);"/> 选项四 
<br> 
<input type="checkbox" value="value5" name="item" onClick="onCheckBox(this);"/> 选项五 
</form>

</body>
</html>

这时我们利用js动态设置只能选两个

<script>
    function chkbox(elm)
    {var obj=document.getElementsByName("item");
        var num=0;
        for (i=0;i<obj.length ;i++ )
            if (obj[i].checked )
                num+=1;
        if (num>2)
        {alert("最多可以选择两个！");
            elm.checked=false;
        }
    }
</script>

这样在选择第三个是会弹出警告框，并且取消选中。