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 相关文章推荐
JavaScript中this关键字使用方法详解
Mar 08 Javascript
JavaScript 乱码问题
Aug 06 Javascript
jquery下异步提交表单 异步跨域提交表单
Nov 17 Javascript
用方法封装javascript的new操作符(一)
Dec 25 Javascript
JS常见问题整理(持续更新)
Aug 06 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
Mar 18 Javascript
jquery实现适用于门户站的导航下拉菜单效果代码
Aug 24 Javascript
ReactNative 之FlatList使用及踩坑封装总结
Nov 29 Javascript
JavaScript实现读取与输出XML文件数据的方法示例
Jun 05 Javascript
详解webpack+ES6+Sass搭建多页面应用
Nov 05 Javascript
Node.js 多线程完全指南总结
Mar 27 Javascript
extjs4图表绘制之折线图实现方法分析
Mar 06 Javascript
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数据缓存技术
2007/02/14 PHP
百度地图API应用之获取用户的具体位置
2014/06/10 PHP
php使用pdo连接报错Connection failed SQLSTATE的解决方法
2014/12/15 PHP
YII中Ueditor富文本编辑器文件和图片上传的配置图文教程
2017/03/15 PHP
jquery cookie插件代码类
2009/05/26 Javascript
JQuery live函数
2010/12/24 Javascript
Pro JavaScript Techniques学习笔记
2010/12/28 Javascript
web的各种前端打印方法之jquery打印插件PrintArea实现网页打印
2013/01/09 Javascript
js判断字符长度以及中英文数字等
2013/12/31 Javascript
离开当前页面前使用js判断条件提示是否要离开页面
2014/05/02 Javascript
jQuery焦点图切换简易插件制作过程全纪录
2014/08/27 Javascript
JavaScript声明变量时为什么要加var关键字
2014/09/29 Javascript
浅析Bootstrap组件之面板组件
2016/05/04 Javascript
基于原生JS实现图片裁剪
2016/08/01 Javascript
jQuery Easy UI中根据第一个下拉框选中的值设置第二个下拉框是否可以编辑
2016/11/29 Javascript
实例解析jQuery中如何取消后续执行内容
2016/12/01 Javascript
ThinkJS中如何使用MongoDB的CURD操作
2016/12/13 Javascript
Angular PWA使用的Demo示例
2019/01/31 Javascript
vue跳转方式(打开新页面)及传参操作示例
2020/01/26 Javascript
[01:42:49]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第一场 2月26日
2021/03/11 DOTA
Python竟能画这么漂亮的花,帅呆了(代码分享)
2017/11/15 Python
一篇文章快速了解Python的GIL
2018/01/12 Python
Python实现PS图像调整黑白效果示例
2018/01/25 Python
Django基础知识 URL路由系统详解
2019/07/18 Python
解决Django中多条件查询的问题
2019/07/18 Python
python3 深浅copy对比详解
2019/08/12 Python
Flask框架学习笔记之使用Flask实现表单开发详解
2019/08/12 Python
python 字典的打印实现
2019/09/26 Python
TensorFlow实现打印每一层的输出
2020/01/21 Python
基于CSS3实现立方体自转效果
2016/03/01 HTML / CSS
HTML5 预加载让页面得以快速呈现
2013/08/13 HTML / CSS
One.com挪威:北欧成长最快的网络托管公司
2016/11/19 全球购物
英国领先的男装设计师服装购物网站:Mainline Menswear
2018/02/04 全球购物
豪华床上用品、床单和浴室必需品:Peacock Alley
2019/09/04 全球购物
美工的岗位职责
2013/11/14 职场文书
工作交流会欢迎词
2014/01/12 职场文书