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 相关文章推荐
js 自定义的联动下拉框
Feb 07 Javascript
关于this和self的使用说明
Aug 01 Javascript
javascript 学习笔记(六)浏览器类型及版本信息检测代码
Apr 08 Javascript
Extjs优化(二)Form表单提交通用实现
Apr 15 Javascript
javascript在myeclipse中报错的解决方法
Oct 29 Javascript
JS JSON对象转为字符串的简单实现方法
Nov 18 Javascript
DOM基础教程之使用DOM设置文本框
Jan 20 Javascript
JS实现完全语义化的网页选项卡效果代码
Sep 15 Javascript
通过函数作用域和块级作用域看javascript的作用域链
Aug 05 Javascript
基于js Canvas实现二次贝塞尔曲线
Dec 25 Javascript
Vue+Element UI 树形控件整合下拉功能菜单(tree + dropdown +input)
Aug 28 Javascript
vue3语法糖内的defineProps及defineEmits
Apr 14 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 购物车的例子
2009/05/04 PHP
php ctype函数中文翻译和示例
2014/03/21 PHP
百度地图API应用之获取用户的具体位置
2014/06/10 PHP
PHP 5.6.11中CURL模块问题的解决方法
2016/08/08 PHP
thinkPHP中volist标签用法示例
2016/12/06 PHP
php脚本守护进程原理与实现方法详解
2017/07/20 PHP
PHP通过文件保存和更新信息的方法分析
2019/09/12 PHP
各情景下元素宽高的获取实现代码
2011/09/13 Javascript
javascript 利用Image对象实现的埋点(某处的点击数)统计
2012/12/28 Javascript
JavaScript事件处理器中的event参数使用介绍
2013/05/24 Javascript
jquery如何根据值设置默认的选中项
2014/03/17 Javascript
Javascript实现快速排序(Quicksort)的算法详解
2015/09/06 Javascript
详解Angular开发中的登陆与身份验证
2016/07/27 Javascript
详解JavaScript中的属性和特性
2016/12/08 Javascript
基于bootstrap的文件上传控件bootstrap fileinput
2016/12/23 Javascript
vue.js实现价格格式化的方法
2017/05/23 Javascript
对angularjs框架下controller间的传值方法详解
2018/10/08 Javascript
Angular6 用户自定义标签开发的实现方法
2019/01/08 Javascript
解决webpack多页面内存溢出的方法示例
2019/10/08 Javascript
jQuery冲突问题解决方法
2021/01/19 jQuery
python读写LMDB文件的方法
2018/07/02 Python
python重试装饰器的简单实现方法
2019/01/31 Python
Tensorflow分批量读取数据教程
2020/02/07 Python
html5 Canvas画图教程(1)—画图的基本常识
2013/01/09 HTML / CSS
英国女鞋购物网站:Moda in Pelle
2019/02/18 全球购物
MaBelle玛贝尔香港官网:香港钻饰连锁店
2019/09/09 全球购物
Marc O’Polo俄罗斯官方在线商店:德国高端时尚品牌
2019/12/26 全球购物
判断单链表中是否存在环
2012/07/16 面试题
社区十八大感言
2014/01/19 职场文书
户外活动策划方案
2014/03/12 职场文书
党的群众路线教育实践活动整改方案
2014/10/28 职场文书
自主招生自荐信范文
2015/03/04 职场文书
2016党校学习心得体会
2016/01/07 职场文书
2016小学优秀教师先进事迹材料
2016/02/26 职场文书
成人成长感言如何写?
2019/08/16 职场文书
MyBatis核心源码深度剖析SQL语句执行过程
2022/05/20 Java/Android