layui实现单个删除和批量删除

layui实现单个删除和批量删除

先获得表格数据

//用户列表
var tableIns = table.render({
   
    elem: '#userList',
    url: '/userList',
    cellMinWidth: 95,
    page: true,
    height: "full-125",
    limits: [10, 15, 20, 25],
    limit: 20,
    id: "userListTable",
    cols: [[
        {
   type: "checkbox", fixed: "left", width: 50},
        {
   field: 'username', title: '用户名', width: 120, minWidth: 100, align: "center"},
        {
   
            field: 'email', title: '用户邮箱', width: 180, minWidth: 200, align: 'center',
            templet: function (d) {
   
                return '<a class="layui-blue" href="mailto:' + d.email + '">' + d.email + '</a>';
            }
        },
        {
   field: 'tel', title: '手机号', width: 130, minWidth: 100, align: "center"},
        {
   
            field: 'sex', title: '用户性别', width: 100, minWidth: 100, align: 'center',
            templet: function (d) {
   
                if (d.sex) {
   
                    return "男";
                } else {
   
                    return "女"
                }
            }
        },
        {
   
            field: 'state', title: '用户状态', width: 150, align: 'center',
            templet: function (d) {
   
                if (d.state) {
   
                    
Layui中,可以通过laydate组件实现单个输入框选择多个时间的功能。具体实现方法如下: 1. 在HTML页面中引入Layui和laydate组件的相关文件: ```html <!-- 引入Layui的核心文件 --> <script src="layui/layui.js"></script> <link rel="stylesheet" href="layui/css/layui.css"> <!-- 引入laydate组件的文件 --> <script src="layui/laydate/laydate.js"></script> ``` 2. 在HTML页面中添加一个输入框,并为其设置一个唯一的ID: ```html <input type="text" class="layui-input" id="test" placeholder="请选择时间"> ``` 3. 在JavaScript中初始化laydate组件,并设置其类型为“日期时间范围”: ```javascript // 初始化laydate组件 laydate.render({ // 绑定输入框的ID elem: '#test', // 设置类型为日期时间范围 type: 'datetime', // 设置范围选择模式 range: '~' }); ``` 4. 运行页面,单击输入框即可在弹出的日期时间选择器中选择多个时间范围。 完整的HTML和JavaScript代码如下所示: ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Layui实现单个输入框选择多个时间</title> <!-- 引入Layui的核心文件 --> <script src="layui/layui.js"></script> <<link rel="stylesheet" href="layui/css/layui.css"> </head> <body> <div class="layui-container"> <div class="layui-row"> <div class="layui-col-md12"> <input type="text" class="layui-input" id="test" placeholder="请选择时间"> </div> </div> </div> <!-- 引入laydate组件的文件 --> <script src="layui/laydate/laydate.js"></script> <script> // 初始化laydate组件 laydate.render({ // 绑定输入框的ID elem: '#test', // 设置类型为日期时间范围 type: 'datetime', // 设置范围选择模式 range: '~' }); </script> </body> </html> ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值