zoukankan      html  css  js  c++  java
  • 处理 laydata 时间日期插件 动态添加多个的问题

    上代码

            $('.datetime').each(function () {
                dateBind(this)
            });
    
            function dateBind(this_){
                laydate.render({
                    elem: this_
                    , type: 'month'
                    , closeStop: this_
                    , trigger: 'click'
    
                });
            }

    如需二次电泳那么必须 获取到 lay-key这个属性

    var num = 0;
            $('.add-min').on('click','.add-experience',function(){
                let dom = $('.experience').eq(0);
                let html = dom.clone(true);
                //删除
                let html2 = '<a href="javascript:;" class="del-experience"><i class="layui-icon layui-icon-close-fill font-size-40"></i></a>';
                $(html).append(html2);
    
                //时间日期
                if(num == 0){
                    num = $('.experience').eq(-1).find('.datetime').eq(-1).attr('lay-key');
                }
                $(html).find('.datetime').each(function () {
                    num = parseInt(num)+1;
                    $(this).attr('lay-key',num);
                    dateBind(this)
                    console.log(num)
                });
    
                $(this).parent().before(html);
                form.render(null, 'form-test');
            })

    附上HTML 参考

                          <div class="layui-card-body experience">
                            <div class="layui-form-item">
                                <div class="layui-input-inline" style=" 200px;">
                                    <input type="text" name="company_name" required  lay-verify="required" placeholder="请输入公司名称" autocomplete="off" class="layui-input">
                                </div>
                                <div class="layui-form-mid">-</div>
                                <div class="layui-input-inline" style=" 200px;">
                                    <input type="text" name="job_begin_date" required  lay-verify="required" placeholder="请选择在职开始时间" autocomplete="off" class="layui-input datetime">
                                </div>
                                <div class="layui-form-mid">-</div>
                                <div class="layui-input-inline" style=" 200px;margin: 0">
                                    <input type="text" name="job_end_date" required  lay-verify="required" placeholder="请选择离职时间" autocomplete="off" class="layui-input datetime">
                                </div>
                                <div style=" auto;margin: 0;" class="layui-input-inline checkbox-date">
                                    <input type="checkbox" class="is_now" lay-filter="is_now" name="is_now" title="至今">
                                </div>
                                <div class="layui-form-mid">-</div>
                                <div class="layui-input-inline" style=" 200px;">
                                    <input type="text" name="job_position" required  lay-verify="required" placeholder="请输入工作职位" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-input-inline" style=" 200px;">
                                    <input type="checkbox" name="experience_verification" title="工作履历验证" lay-filter="test" lay-skin="primary" checked disabled>
                                </div>
                                <div class="layui-input-inline" style=" 200px;">
                                    <input type="checkbox" name="performance_verification" title="工作表现鉴定" lay-filter="test" lay-skin="primary">
                                </div>
    
                                <div class="layui-input-inline vip_service" style=" 200px;display: none">
                                    <input type="checkbox" name="vip_service_num" title="是否特色模式" lay-filter="test" lay-skin="primary">
                                </div>
                            </div>
    
                            <!--<a href="javascript:;" class="del-experience">
                                 <i class="layui-icon layui-icon-close-fill font-size-40"></i>
                            </a>-->
                            <hr>
                        </div>
  • 相关阅读:
    服务器实现跨域
    quartz定时任务cron表达式详解
    mysql分区/分片
    微信小程序 之三元运算符代替wx:if 来解决背景图片显示隐藏
    微信小程序 本地缓存保持登录状态之wx.setStorageSync()使用技巧
    微信小程序 赋值问题
    微信小程序 wx.navigateTo()传参及多个参数方法
    js 循环遍历数组
    VUE之Router命令行警告:Named Route 'Home' has a default child route. 解决办法
    VUE之命令行报错:Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead 解决办法
  • 原文地址:https://www.cnblogs.com/liuxd/p/13491042.html
Copyright © 2011-2022 走看看