<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>layui在线调试</title>
    <link rel="stylesheet" type="text/css" href="./utils/layui-v2.5.4/layui/css/layui.css">
    <style>
        body {
            margin: 10px;
        }
        .demo-carousel {
            height: 200px;
            line-height: 200px;
            text-align: center;
        }
    </style>
</head>
<body>
    <form class="layui-form">
        <div class="checkallbox">
            <input lay-skin="primary" type="checkbox" id="checkall" name="type" lay-filter="allChoose"
                value="checkall" /><span>全选</span></div>
        <div class="seach-box">
            <ul>
                <li><input lay-skin="primary" type="checkbox" name="like1[aaa]" value="111" /><span>aaa</span></li>
                <li><input lay-skin="primary" type="checkbox" name="like1[bbb]" value="222" /><span>bbb</span></li>
                <li><input lay-skin="primary" type="checkbox" name="like1[ccc]" value="333" /><span>ccc</span></li>
                <li><input lay-skin="primary" type="checkbox" name="like1[ddd]" value="444" /><span>ddd</span></li>
            </ul>
        </div>
    </form>
    <script src="./utils/layui-v2.5.4/layui/layui.js"></script>
    <script src="./utils/jquery-3.4.1.min.js"></script>
    <script>
        layui.use(['form', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element', 'slider'], function () {
            var form = layui.form//日期
                , laypage = layui.laypage //分页
                , layer = layui.layer //弹层
                , table = layui.table //表格
                , carousel = layui.carousel //轮播
                , upload = layui.upload //上传
                , element = layui.element //元素操作
                , slider = layui.slider //滑块
            form.on('checkbox(allChoose)', function (data) {
                var child = $(".seach-box input[type='checkbox']");
                child.each(function (index, item) {
                    item.checked = data.elem.checked;
                });
                form.render('checkbox');
            });
        });
    </script>
</body>
</html>

layui的form表单的checkbox全选与全不选问题的更多相关文章

  1. layui中form表单渲染的问题

    layui 官网的这部分文档介绍:http://www.layui.com/doc/modules/form.html#render 注意:针对的是表单元素,input select  textare ...

  2. layui渲染form表单

    有时ajax请求的数据返回时,页面已经加载了,此时就无法展示ajax加载的内容,如果要局部刷新表单,则加上如下代码: layui.use('form', function() { var form = ...

  3. 20181019 记录 window.setTimeout('dofunction()',2000); - layui form 表单提交 事件 - F11全屏 事件 window.onresize

    1 延时事件 window.setTimeout('dofunction()',2000); 函数外面要有引号 如果没有引号 就不能延时执行 应该是内容进行eval,所以外层不是传递字符串的话,外层函 ...

  4. Checkbox框全选操作，form表单提交与jquery ajax提交两种处理方式

    //1.jquery ajax<script type="text/javascript"> $(function(){ var basePath = $(" ...

  5. Layui：前后端分离之Form表单

    页面效果图: <div style="display: none;" id="formContainer"> <form class=&quo ...

  6. [原创]java WEB学习笔记62：Struts2学习之路--表单标签:form,表单标签的属性，textfield, password, hidden，submit ，textarea ，checkbox ，list, listKey 和 listValue 属性，select ，optiongroup ，checkboxlist

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  7. Form表单之复选框checkbox操作

    input复选(checkbox): <label>input复选1组:</label> <input type="checkbox" name=&q ...

  8. 巨蟒python全栈开发django11:ajax&&form表单上传文件contentType

    回顾: 什么是异步? 可以开出一个线程,我发出请求,不用等待返回,可以做其他事情. 什么是同步? 同步就是,我发送出了一个请求,需要等待返回给我信息,我才可以操作其他事情. 局部刷新是什么? 通过jq ...

  9. PHP全栈开发（四）: HTML 学习（3. form 表单）

    form 表单标签 它表的是一个区域,而非是一个具体的某个元素,它也是作为一个容器的存在. 表单域主要是允许用户在表单域中输入内容,比如文本框,下拉列表,单选框,复选框,等等. <!DOCTYP ...

随机推荐

  1. HttpClient系统日志配置

    详细介绍在:http://hc.apache.org/httpclient-3.x/logging.html 一般使用context logging基本够用,context logging解释原文如下 ...

  2. Java IO: 其他字节流(上)

    作者: Jakob Jenkov 译者: 李璟(jlee381344197@gmail.com) 本小节会简要概括Java IO中的PushbackInputStream,SequenceInputS ...

  3. 微信发送朋友圈URL JSAPI事件demo

    <script> var imgUrl = 'http://m.ximiyu.com/content/images/thumbs/0000126_540.jpeg'; var lineLi ...

  4. unittest（22）- p2p项目实战（4）-read_config

    # 4. read_config.py import configparser class ReadConfig: @staticmethod def get_config(file_path, se ...

  5. 使用Connector / Python连接MySQL/查询数据

    使用Connector / Python连接MySQL connect()构造函数创建到MySQL服务器的连接并返回一个 MySQLConnection对象 在python中有以下几种方法可以连接到M ...

  6. 文本快速分类利器fasttext使用心得（踩坑之路）

    fasttext是文本分类的一大利器,优点:快,嗷嗷快:缺点:暂未发现.但是我在使用其做文本分类时候还是遇到了挺多坑,今天先总结一个: 网上有人说设置训练参数的时候,ngrams设置大于2可以提高模型 ...

  7. http概述——http笔记一

    之前想深入的了解学习下HTTP,所以就买了本砖头<HTTP权威指南>.最近一直在看,可是发现看书只有输入并没有输出,不行.所以就打算把自己的理解写成一系列的笔记,供以后翻阅. 大概画了张本 ...

  8. linux增加history时间戳

    增加环境变量到/etc/profile export HISTTIMEFORMAT="%Y-%m-%d %H:%M:%S " export HISTSIZE=9999

  9. selenium&appium中的三种等待方式---基于python

    我们在实际使用selenium或者appium时,等待下个等待定位的元素出现,特别是web端加载的过程,都需要用到等待,而等待方式的设置是保证脚本稳定有效运行的一个非常重要的手段,在selenium中 ...

  10. JavaScript 設計模型 - Iterator

    Iterator Pattern是一個很重要也很簡單的Pattern:迭代器!我們可以提供一個統一入口的迭代器,Client只需要知道有哪些方法,或是有哪些Concrete Iterator,並不需要 ...