记录：layui框架， js使用 laydate动态创建多个时间选择框，点击无效问题。此外，使用laydate时间选择框生效的关键一点是，laydate框架会给input输入框增加一个lay-key=“1”，1也可能是其他数字。

例如下图所示，js实现动态添加多行数据，并使用laydate动态创建多个时间选择框

HTML代码：

<style>
    .layui-table th{padding: 9px 5px;}
    .layui-table td{ padding: 9px 3px;}
    .add,.delete{font-weight: bold;border-radius: 10px;width: 20px;height: 20px;line-height: 20px;font-size: 18px;}
    .delete{ margin-left: 4px !important;background-color: #f38600;}
</style>
        <div class="layui-form-item">
            <label class="layui-form-label required">装卸费率</label>
            <div class="layui-input-block">
                <table id="datatable" class="table layui-table">
					<thead>
						<tr>
							<th>计费项目</th>
							<th>计费方式</th>
							<th>流量统计方式</th>
                            <th>数量</th>
                            <th>计量单位</th>
							<th>单价</th>
							<th>开始时间</th>
							<th>结束时间</th>
							<th>备注</th>
							<th style="border: none; background-color: #fff;min-width: 44px;"></th>
						</tr>
					</thead>
					<tbody>						
						<tr data-line="0">
							<td>
                                <div class="layui-row layui-col-xs12">                                    
                                    <input type="text" name="" class="layui-input" value="装卸" readonly style="border: none;">
                                    <input type="hidden" name='hand_rate[0][project]' value="2">
                                </div>
                            </td>
							<td>
                                <div class="layui-row layui-col-xs12">
                                    <select name="hand_rate[0][style]">
                                        <option value="">请选择</option>
                                        {:get_status_option(0,'jifei_style')}
                                    </select>
                                </div>
                            </td>
							<td>
                                <div class="layui-row layui-col-xs12">
                                    <select name="hand_rate[0][flow_style]">
                                        <option value="">请选择</option>
                                        {:get_status_option(0,'jifei_flow_style')}
                                    </select>
                                </div>
                            </td>
							<td>
                                <div class="layui-row layui-col-xs12">
                                    <input type="text" name="hand_rate[0][number]" class="layui-input" lay-verify="required" lay-reqtext="数量" placeholder="数量" value="">
                                </div>
                            </td>							
							<td>
                                <div class="layui-row layui-col-xs12">
                                    <input type="text" name="hand_rate[0][unit]" class="layui-input" lay-verify="required" lay-reqtext="计量单位" placeholder="计量单位" value="">
                                </div>
                            </td>							
							<td>
                                <div class="layui-row layui-col-xs12">
                                    <input type="text" name="hand_rate[0][price]" class="layui-input" lay-verify="required" lay-reqtext="单价" placeholder="单价" value="">
                                </div>
                            </td>							
							<td>
                                <div class="layui-row layui-col-xs12">
                                    <input type="text" name="hand_rate[0][start_time]" data-date="" data-date-type="date" class="layui-input " id="hand_rate_start_time0" lay-verify="required"  placeholder="开始时间" value="">
                                </div>
                            </td>							
							<td>
                                <div class="layui-row layui-col-xs12">
                                    <input type="text" name="hand_rate[0][end_time]" data-date="" data-date-type="date" class="layui-input" id="hand_rate_end_time0" lay-verify="required"  placeholder="结束时间" value="">
                                </div>
                            </td>							
							<td>
                                <div class="layui-row layui-col-xs12">
                                    <input type="text" name="hand_rate[0][remark]" class="layui-input" lay-reqtext="备注" placeholder="备注" value="">
                                </div>
                            </td>
                            <td style="border: none;">
                                <button type="button" class="layui-btn layui-btn-xs add" onclick="addFeiFunc($(this))">+</button>
                                <button type="button" class="layui-btn layui-btn-xs delete" onclick="deleteFeiFunc($(this))">-</button>
                            </td>
						</tr>
					</tbody>
				</table>
            </div>
        </div>

JS代码：

<script src="__STATIC__/jquery.min.js?v={$version}" charset="utf-8"></script>
<script>
//JavaScript代码区域
layui.use(['element', 'table', 'form'], function () {
	var element = layui.element,
		table = layui.table
        , form = layui.form
        ,laydate = layui.laydate
        
    //加
    addFeiFunc = function (t){
        var thisHang = t.parent().parent();
        var tbody = thisHang.parent();
        var line = thisHang.data('line');
        //获取最后一行，必须是最后一行的“+”点击        
        var lastLine = $('tr:last',tbody).data('line');
        if(line != lastLine){
            layer.msg('error');
            return false;
        }
        //判断总行数，最多增加5条
        var lineCount = $('tr',tbody).length;
        if(lineCount >= 5){
            layer.msg('最多添加5条费率');
            return false;
        }
        //下一行的行数
        var nextLine = line + 1;
        var tr = '<tr data-line='+nextLine+'>'+
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+                                    
                            '<input type="text" name="" class="layui-input" value="装卸" readonly style="border: none;">'+
                            '<input type="hidden" name="hand_rate['+nextLine+'][project]" value="2">'+
                        '</div>'+
                    '</td>'+
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+       
                            '<select name="hand_rate['+nextLine+'][style]">'+
                                '<option value="">请选择</option>'+
                                '{:get_status_option(0,"jifei_style")}'+
                            '</select>'+
                        '</div>'+
                    '</td>'+
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+   
                            '<select name="hand_rate['+nextLine+'][flow_style]">'+
                                '<option value="">请选择</option>'+
                                '{:get_status_option(0,"jifei_flow_style")}'+
                            '</select>'+
                        '</div>'+
                    '</td>'+
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+
                            '<input type="text" name="hand_rate['+nextLine+'][number]" class="layui-input" lay-verify="required" lay-reqtext="数量" placeholder="数量" value="">'+
                        '</div>'+
                    '</td>'+							
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+
                            '<input type="text" name="hand_rate['+nextLine+'][unit]" class="layui-input" lay-verify="required" lay-reqtext="计量单位" placeholder="计量单位" value="">'+
                        '</div>'+
                    '</td>'+							
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+
                            '<input type="text" name="hand_rate['+nextLine+'][price]" class="layui-input" lay-verify="required" lay-reqtext="单价" placeholder="单价" value="">'+
                        '</div>'+
                    '</td>'+							
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+
                            '<input type="text" name="hand_rate['+nextLine+'][start_time]" data-date="" data-date-type="date" class="layui-input" id="hand_rate_start_time'+nextLine+'" lay-verify="required"  placeholder="开始时间" value="">'+
                        '</div>'+
                    '</td>'+							
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+
                            '<input type="text" name="hand_rate['+nextLine+'][end_time]" data-date="" data-date-type="date" class="layui-input" id="hand_rate_end_time'+nextLine+'" lay-verify="required"  placeholder="结束时间" value="">'+
                        '</div>'+
                    '</td>'+							
                    '<td>'+
                        '<div class="layui-row layui-col-xs12">'+
                            '<input type="text" name="hand_rate['+nextLine+'][remark]" class="layui-input" lay-reqtext="备注" placeholder="备注" value="">'+
                        '</div>'+
                    '</td>'+
                    '<td style="border: none;">'+
                        '<button type="button" class="layui-btn layui-btn-xs add" οnclick="addFeiFunc($(this))">+</button>'+
                        '<button type="button" class="layui-btn layui-btn-xs delete" οnclick="deleteFeiFunc($(this))">-</button>'+
                    '</td>'+
                '</tr>';
        tbody.append(tr);    
        form.render();
        //执行laydate实例
        laydate.render({
            elem: '#hand_rate_start_time'+nextLine+'' //指定日期元素的id
        });
        laydate.render({
            elem: '#hand_rate_end_time'+nextLine+'' //指定日期元素的id
        });
        //隐藏此行的加号
        t.hide();
    }

    //减
    deleteFeiFunc = function (t){
        var thisHang = t.parent().parent();
        var tbody = thisHang.parent();
        //移除次行
        thisHang.remove();
        //最后一行的‘+’显示
        $('tr:last',tbody).find('.add').show();
    }

})
</script>