h5自带的时间选择器,简单,但是美观性上差一些,可以用layui自带的时间选择器插件,来美化一下
效果
修改的话,其他代码无需变化
js添加代码
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
laydate.render({
elem: '#time_start',
});
laydate.render({
elem: '#time_end',
});
});
</script>
注意:time_start和time_end需要分开写,不能写在一起
<label class="layui-form-label">日期区间</label>
<div class="layui-input-inline">
<input class="layui-input" id="time_start" name="time_start" type="text" value="{$data_where.time_start}" placeholder="yyyy-MM-dd">
</div>
<div class="layui-input-inline">
<input class="layui-input" id="time_end" name="time_end" type="text" value="{$data_where.time_end}" placeholder="yyyy-MM-dd">
</div>
type="date"需要改为text或者直接删掉,不然的话,会点击的时候,出来两个时间选择器,重叠显示