[ layui ] 复选框限定个数。

最新推荐文章于 2023-09-04 00:00:00 发布

momozi_

最新推荐文章于 2023-09-04 00:00:00 发布

阅读量369

点赞数 1

分类专栏： layui 文章标签： layui jquery

本文链接：https://blog.csdn.net/momozi_/article/details/127109566

版权

layui 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

html部分

<ul class="multiple_list layui-form">
    <li><input type="checkbox" name="demo" title="陈立平" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="何勇" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="李道亮" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="李淼" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="刘成良" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="刘劫" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="王志海" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="吴华瑞" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="徐焕良" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="许童羽" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="杨信廷" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="尹首一" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="于海业" lay-skin="primary"></li>
    <li><input type="checkbox" name="demo" title="于合龙" lay-skin="primary"></li>
</ul>

js部分

$('.multiple_list li').click(function () {
    if ($('.layui-form-checked').length > 4) {
        $(this)[0].lastElementChild.className = 'layui-unselect layui-form-checkbox'
        $(this).children('input').prop("checked", false)
        return false
    }
})

以上仅是自己的个人见解大家可以互相交流学习。