900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > laydate日期时间插件年选择器和年月选择器实现不用点击确定

laydate日期时间插件年选择器和年月选择器实现不用点击确定

时间:2018-09-02 10:33:12

相关推荐

laydate日期时间插件年选择器和年月选择器实现不用点击确定

laydate日期时间插件只有是日期的时候才不用点确定,年选择器和年月选择器的时候必须点确定才能选中。用起来很不方便,这里在不改变源代码的情况实现不用点击确定。

1.年选择器实现

<input type="text" name="year" id="year" placeholder="yyyy-MM" class="layui-input" >

js代码

layui.use('laydate', function(){var laydate = layui.laydate;var initYear;laydate.render({elem: '#year',type: 'year',/* ready和change函数是为了实现选择年份时不用点确定直接关闭 */ready: function(date){ // 控件在打开时触发,回调返回一个参数:初始的日期时间对象initYear = date.year;},change: function(value, date, endDate){ // 年月日时间被切换时都会触发。回调返回三个参数,分别代表:生成的值、日期时间对象、结束的日期时间对象var selectYear = date.year;var differ = selectYear-initYear;if (differ != 15 && differ != -15) {if($(".layui-laydate").length){$("#year").val(value);$(".layui-laydate").remove();}}initYear = selectYear;}});});

2.年月选择器实现

<input type="text" name="yearMonth" id="yearMonth" placeholder="yyyy-MM" class="layui-input" >

js代码

layui.use('laydate', function(){var laydate = layui.laydate;var initYear;laydate.render({elem: '#yearMonth',type: 'month',/* ready和change函数是为了实现选择年月时不用点确定直接关闭 */ready: function(date){ // 控件在打开时触发,回调返回一个参数:初始的日期时间对象initYear = date.year;},change: function(value, date, endDate){ // 年月日时间被切换时都会触发。回调返回三个参数,分别代表:生成的值、日期时间对象、结束的日期时间对象var selectYear = date.year;var differ = selectYear-initYear;if (differ == 0) {if($(".layui-laydate").length){$("#yearMonth").val(value);$(".layui-laydate").remove();}}initYear = selectYear;}});});

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。