layDate插件设置开始和结束时间


Posted in Javascript onNovember 15, 2018

本文教大家使用了laydate插件设置开始和结束时间,供大家参考,具体内容如下

用的laydate插件是layDate-v5.0.6,是新版本的;

效果是选择开始时间,选择结束时间的时候开始时间之前的时间不能选;

选择结束时间,选择开始时间的时候结束时间之后的时间不能选;

function time(){
        //开始时间id="start",结束时间id="end";
        var start = {
          elem: '#start',
          type:'date',
          min: '2000-09-10',
          max: '2333-09-20',
          show: true,
          closeStop: '#start'
 
        };
        var end = {
          elem: '#end',
          type:'date',
          min: '2000-09-10',
          max: '2333-09-20',
          show: true,
          closeStop: '#end'
        };
        lay('#start').on('click', function(e){
          if($('#end').val() != null && $('#end').val() != undefined && $('#end').val() != ''){
            start.max = $('#end').val();
          }
          laydate.render(start);
        });
        lay('#end').on('click', function(e){
          if($('#start').val() != null && $('#start').val() != undefined && $('#start').val() != ''){
            end.min = $('#start').val();
          }
          laydate.render(end);
        });
 
 
      }

最后调用就行了;

因为我引用了jquery;

所以如果没有引用jquery的;获取元素的值可以换成原生的;

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 页面输出值
Nov 30 Javascript
javascript 函数速查表
Feb 07 Javascript
ASP.NET中使用后端代码注册脚本 生成JQUERY-EASYUI的界面错位的解决方法
Jun 12 Javascript
基于JQUERY的两个ListBox子项互相调整的实现代码
May 07 Javascript
JS实现鼠标点击展开或隐藏表格行的方法
Mar 03 Javascript
JS实现窗口加载时模拟鼠标移动的方法
Jun 03 Javascript
基于JavaScript实现购物网站商品放大镜效果
Sep 06 Javascript
JavaScript 链式结构序列化详解
Sep 30 Javascript
vue通过点击事件读取音频文件的方法
May 30 Javascript
详解Angular-ui-BootStrap组件的解释以及使用
Jul 13 Javascript
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 jQuery
利用vue3+ts实现管理后台(增删改查)
Oct 30 Javascript
解决vue2 在mounted函数无法获取prop中的变量问题
Nov 15 #Javascript
vue中使用better-scroll实现滑动效果及注意事项
Nov 15 #Javascript
layDate日期控件使用方法详解
Nov 15 #Javascript
vue2中引用及使用 better-scroll的方法详解
Nov 15 #Javascript
Vue一个案例引发的递归组件的使用详解
Nov 15 #Javascript
一份超级详细的Vue-cli3.0使用教程【推荐】
Nov 15 #Javascript
Angular事件之不同组件间传递数据的方法
Nov 15 #Javascript
You might like
星际争霸, 教主第一视角, ZvT经典龙蛇演义
2020/03/02 星际争霸
php横向重复区域显示二法
2008/09/25 PHP
PHP 分页类(模仿google)-面试题目解答
2009/09/13 PHP
PHP 面向对象 PHP5 中的常量
2010/05/05 PHP
关于PHP内存溢出问题的解决方法
2013/06/25 PHP
PHP通过反射动态加载第三方类和获得类源码的实例
2015/11/27 PHP
PHP链表操作简单示例
2016/10/15 PHP
js 操作select和option常用代码整理
2012/12/13 Javascript
jquery实现简单的二级导航下拉菜单效果
2015/09/07 Javascript
AngularJS入门教程之控制器详解
2016/07/27 Javascript
JavaScript 函数模式详解及示例
2016/09/07 Javascript
微信小程序 购物车简单实例
2016/10/24 Javascript
jQuery中Nicescroll滚动条插件的用法
2016/11/10 Javascript
JS冒泡事件与事件捕获实例详解
2016/11/25 Javascript
js 性能优化之快速响应的用户界面
2017/02/15 Javascript
Zepto实现密码的隐藏/显示
2017/04/07 Javascript
Angular 2父子组件数据传递之局部变量获取子组件其他成员
2017/07/04 Javascript
bootstrap日期插件daterangepicker使用详解
2017/10/19 Javascript
JavaScript日期工具类DateUtils定义与用法示例
2018/09/03 Javascript
JSON字符串操作移除空串更改key/value的介绍
2019/01/05 Javascript
JavaScript Array对象使用方法解析
2019/09/24 Javascript
解决包含在label标签下的checkbox在ie8及以下版本点击事件无效果兼容的问题
2019/10/27 Javascript
茶余饭后聊聊Vue3.0响应式数据那些事儿
2019/10/30 Javascript
Javascript Worker子线程代码实例
2020/02/20 Javascript
分享一款超好用的JavaScript 打包压缩工具
2020/04/26 Javascript
Vue-cli assets SubDirectory及PublicPath区别详解
2020/08/18 Javascript
python常见数制转换实例分析
2015/05/09 Python
Python中random模块用法实例分析
2015/05/19 Python
Python中的条件判断语句基础学习教程
2016/02/07 Python
python脚本作为Windows服务启动代码详解
2018/02/11 Python
python 获取list特定元素下标的实例讲解
2018/04/09 Python
电子商务毕业生求职信
2013/11/10 职场文书
竞选学生会演讲稿
2014/04/25 职场文书
重阳节活动主持词
2015/07/04 职场文书
Python turtle编写简单的球类小游戏
2022/03/31 Python
mysql数据库实现设置字段长度
2022/06/10 MySQL