bootstrap datetimepicker2.3.11时间插件使用


Posted in Javascript onNovember 19, 2016

本文实例为大家分享了bootstrap datetimepicker使用方法,供大家参考,具体内容如下

时间插件之结束时间不能小于开始时间

changeDate: function (starttime,stoptime) {      //判断时间的大小弹窗提示用户
 var _t = this;
  if(stoptime != '' && starttime != ''){
   if(stoptime < starttime){
    $('#stop-date').val('');
    $('#time').modal('show');
    setTimeout(function(){($('#time').modal('hide'))},3000);
    return;
   }
  }
 },
timeDatapicker:function () {
  var _t = this;           //this
  var startDate = $('#start-date'),      //开始时间
   stopDate = $('#stop-date');       //结束时间

  startDate.datetimepicker({
   format: 'yyyy-mm-dd',
   autoclose: true,
   minView: 2,
   language:'zh-CN'
  }).on('change',function () {       //changeData方法写在change之后,是为了防止changeData有changge方法(避免冲突)
   var starttime = startDate.val();
   var stoptime = stopDate.val();
   _t.changeDate(starttime,stoptime);
   stopDate.datetimepicker('setStartDate',starttime); //结束时间的选择将以选择的开始时间为依据从新设置(等于开始 时间)

  }).on('changeDate',function () {
   var starttime = startDate.val();
   stopDate.datetimepicker('setStartDate',starttime); //结束时间的选择将以选择的开始时间为依据从新设置(等于开始 时间)
   var stoptime = stopDate.val();
  });

  stopDate.datetimepicker({
   format: 'yyyy-mm-dd',
   autoclose: true,
   minView: 2,
   language:'zh-CN'
  }).on('change',function () {
   var starttime = startDate.val();
   var stoptime = stopDate.val();
   _t.changeDate(starttime,stoptime,$(this));

  }).on('changeDate',function () {

   var starttime = startDate.val();
   var stoptime = stopDate.val();
   startDate.datetimepicker('setEndDate',stoptime);
   stopDate.datetimepicker('setStartDate',starttime);
  });

 },

如果大家还想深入学习,可以点击这里进行学习,再为大家附3个精彩的专题:

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

Javascript 相关文章推荐
IE关闭时判断及AJAX注销案例学习
Feb 18 Javascript
javascript实现详细时间提醒信息效果的方法
Mar 11 Javascript
JS实现CheckBox复选框全选全不选功能
May 06 Javascript
Javascript删除指定元素节点的方法
Jun 21 Javascript
EasyUI创建对话框的两种方式
Aug 23 Javascript
Web制作验证码功能实例代码
Jun 19 Javascript
使用vuex缓存数据并优化自己的vuex-cache
May 30 Javascript
js脚本中执行java后台代码方法解析
Oct 11 Javascript
js实现掷骰子小游戏
Oct 24 Javascript
详解JavaScript之ES5的继承
Jul 08 Javascript
Ant design vue table 单击行选中 勾选checkbox教程
Oct 24 Javascript
vue实现列表垂直无缝滚动
Apr 08 Vue.js
js 定位到某个锚点的方法
Nov 19 #Javascript
js 模仿锚点定位的实现方法
Nov 19 #Javascript
Javascript使用function创建类的两种方法(推荐)
Nov 19 #Javascript
js 中获取制定的cook信息实现方法
Nov 19 #Javascript
微信小程序入门教程
Nov 18 #Javascript
网络传输协议(http协议)
Nov 18 #Javascript
基于JS组件实现拖动滑块验证功能(代码分享)
Nov 18 #Javascript
You might like
PHP实现简单的计算器
2020/08/28 PHP
基于jquery的关于动态创建DOM元素的问题
2010/12/24 Javascript
左右悬浮可分组的网站QQ在线客服代码(可谓经典)
2012/12/21 Javascript
使用Chrome调试JavaScript的断点设置和调试技巧
2014/12/16 Javascript
jsonp跨域请求数据实现手机号码查询实例分析
2015/12/12 Javascript
对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache详解
2016/04/11 Javascript
BootStrap与validator 使用笔记(JAVA SpringMVC实现)
2016/09/21 Javascript
快速解决Vue项目在IE浏览器中显示空白的问题
2018/09/04 Javascript
vue-cli3使用mock数据的方法分析
2020/03/16 Javascript
vue如何使用外部特殊字体的操作
2020/07/30 Javascript
element 动态合并表格的步骤
2020/12/31 Javascript
Nodejs 数组的队列以及forEach的应用详解
2021/02/25 NodeJs
Python判断Abundant Number的方法
2015/06/15 Python
Pycharm学习教程(4) Python解释器的相关配置
2017/05/03 Python
想学python 这5本书籍你必看!
2018/12/11 Python
Python遍历文件夹 处理json文件的方法
2019/01/22 Python
详解Pandas之容易让人混淆的行选择和列选择
2019/07/10 Python
使用APScheduler3.0.1 实现定时任务的方法
2019/07/22 Python
Python使用贪婪算法解决问题
2019/10/22 Python
Python实现密码薄文件读写操作
2019/12/16 Python
TensorFlow——Checkpoint为模型添加检查点的实例
2020/01/21 Python
Python xlrd excel文件操作代码实例
2020/03/10 Python
智利最大的网上商店:Linio智利
2016/11/24 全球购物
环境科学专业个人求职信
2013/09/26 职场文书
质检员岗位职责
2013/12/17 职场文书
机关门卫岗位职责
2013/12/30 职场文书
主管会计岗位责任制
2014/02/10 职场文书
个人授权委托书
2014/04/03 职场文书
质量安全标语
2014/06/07 职场文书
自动化专业毕业生求职信
2014/06/18 职场文书
单位个人查摆问题及整改措施
2014/10/28 职场文书
雾霾停课通知
2015/04/24 职场文书
歌剧魅影观后感
2015/06/05 职场文书
思想品德课教学反思
2016/02/24 职场文书
Java生成读取条形码和二维码的简单示例
2021/07/09 Java/Android
Python写情书? 10行代码展示如何把情书写在她的照片里
2022/04/21 Python