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 相关文章推荐
Three.js源码阅读笔记(光照部分)
Dec 27 Javascript
jQuery设置与获取HTML,文本和值的简单实例
Feb 26 Javascript
关于Javascript 对象(object)的prototype
May 09 Javascript
基于javascript制作微信聊天面板
Aug 09 Javascript
教你用javascript实现随机标签云效果_附代码
Mar 16 Javascript
JS 插件dropload下拉刷新、上拉加载使用小结
Apr 13 Javascript
vue中使用sessionStorage记住密码功能
Jul 24 Javascript
详解Vue+axios+Node+express实现文件上传(用户头像上传)
Aug 10 Javascript
JS学习笔记之原型链和利用原型实现继承详解
May 29 Javascript
js中let能否完全替代IIFE
Jun 15 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
Aug 16 Javascript
node koa2 ssr项目搭建的方法步骤
Dec 11 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使用session二维数组实例
2014/11/06 PHP
Yii2框架BootStrap样式的深入理解
2016/11/07 PHP
yii2实现Ueditor百度编辑器的示例代码
2018/11/02 PHP
javascript中的有名函数和无名函数
2007/10/17 Javascript
javascript 数组的方法集合
2008/06/05 Javascript
JavaScript高级程序设计 读书笔记之十一 内置对象Global
2012/03/07 Javascript
javascript获取元素CSS样式代码示例
2013/11/28 Javascript
一个字符串反转函数可实现字符串倒序
2014/09/15 Javascript
javascript密码强度校验代码(两种方法)
2015/08/10 Javascript
以JavaScript来实现WordPress中的二级导航菜单的方法
2015/12/14 Javascript
微信小程序实现tab左右切换效果
2020/11/15 Javascript
微信小程序canvas绘制圆角base64图片的实现
2019/08/18 Javascript
Vue element-ui父组件控制子组件的表单校验操作
2020/07/17 Javascript
[27:08]完美世界DOTA2联赛PWL S2 SZ vs Rebirth 第二场 11.21
2020/11/23 DOTA
Python实现将数据库一键导出为Excel表格的实例
2016/12/30 Python
python之从文件读取数据到list的实例讲解
2018/04/19 Python
对pandas的层次索引与取值的新方法详解
2018/11/06 Python
详解Python3之数据指纹MD5校验与对比
2019/06/11 Python
Pandas之MultiIndex对象的示例详解
2019/06/25 Python
Selenium获取登录Cookies并添加Cookies自动登录的方法
2020/12/04 Python
python上下文管理的使用场景实例讲解
2021/03/03 Python
HTML5 客户端数据库简易使用:IndexedDB
2019/12/19 HTML / CSS
俄罗斯香水和化妆品购物网站:Л’Этуаль
2018/05/10 全球购物
Prototype中如何为一个元素添加一个方法
2014/12/08 面试题
企业门卫岗位职责
2013/12/12 职场文书
承诺书范文
2014/06/03 职场文书
运动会口号大全
2014/06/07 职场文书
大学生创业计划书
2014/08/14 职场文书
公司保洁员岗位职责
2015/02/13 职场文书
银行催款通知书
2015/04/17 职场文书
2015年语言文字工作总结
2015/07/23 职场文书
超市主管竞聘书
2015/09/15 职场文书
详解NodeJS模块化
2021/06/15 NodeJs
微软PC Health Check电脑健康状况检查应用下载(Win11配置检测工具)
2021/06/26 数码科技
Flask response响应的具体使用
2021/07/15 Python
排查MySQL生产环境索引没有效果
2022/04/11 MySQL