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 HTML中的table
Apr 15 Javascript
跨域表单提交状态的变相判断代码
Nov 12 Javascript
js常用排序实现代码
Dec 28 Javascript
jquery实现控制表格行高亮实例
Jun 05 Javascript
javascript替换已有元素replaceChild()使用介绍
Apr 03 Javascript
JS实现可关闭的对联广告效果代码
Sep 14 Javascript
基于JavaScript代码实现兼容各浏览器的设为首页和加入收藏
Jan 07 Javascript
Bootstrap3下拉菜单的实现
Feb 22 Javascript
JS拉起或下载app的实现代码
Feb 22 Javascript
利用canvas实现的加载动画效果实例代码
Jul 05 Javascript
利用js实现简易红绿灯
Oct 15 Javascript
LayUI+Shiro实现动态菜单并记住菜单收展的示例
May 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上传、管理照片示例
2006/10/09 PHP
php实现12306火车票余票查询和价格查询(12306火车票查询)
2014/01/14 PHP
PHP 5.3新增魔术方法__invoke概述
2014/07/23 PHP
作为程序员必知的16个最佳PHP库
2015/12/09 PHP
PHP计算当前坐标3公里内4个角落的最大最小经纬度实例
2016/02/26 PHP
javascript中比较字符串是否相等的方法
2013/07/23 Javascript
jQuery瀑布流插件Wookmark使用实例
2014/04/02 Javascript
JavaScript 封装一个tab效果源码分享
2015/09/15 Javascript
AngualrJS中每次$http请求时的一个遮罩层Directive
2016/01/26 Javascript
jQuery图片轮播实现并封装(一)
2016/12/03 Javascript
vue多页面开发和打包正确处理方法
2018/04/20 Javascript
jQuery中each和js中forEach的区别分析
2019/02/27 jQuery
在VUE中实现文件下载并判断状态的方法
2019/11/08 Javascript
《javascript设计模式》学习笔记四:Javascript面向对象程序设计链式调用实例分析
2020/04/07 Javascript
Element-ui el-tree新增和删除节点后如何刷新tree的实例
2020/08/31 Javascript
Python中捕捉详细异常信息的代码示例
2014/09/18 Python
django使用图片延时加载引起后台404错误
2017/04/18 Python
pandas中去除指定字符的实例
2018/05/18 Python
python 每天如何定时启动爬虫任务(实现方法分享)
2018/05/21 Python
解决在Python编辑器pycharm中程序run正常debug错误的问题
2019/01/17 Python
Python字典添加,删除,查询等相关操作方法详解
2020/02/07 Python
python实现单机五子棋
2020/08/28 Python
详解Python+Selenium+ChromeDriver的配置和问题解决
2021/01/19 Python
Html5移动端获奖无缝滚动动画实现示例
2018/06/25 HTML / CSS
Booking.com英国官网:全球酒店在线预订网站
2018/04/21 全球购物
澳大利亚最超值的自行车之家:Reid Cycles
2019/03/24 全球购物
《学会待客》教学反思
2014/02/22 职场文书
小学毕业演讲稿
2014/04/25 职场文书
个人主要事迹材料
2014/08/26 职场文书
综治维稳工作承诺书
2014/08/30 职场文书
体育教师个人工作总结
2015/02/09 职场文书
在酒桌上的敬酒词
2015/08/12 职场文书
简历中的自我评价怎么写呢?
2019/04/30 职场文书
5种方法告诉你如何使JavaScript 代码库更干净
2021/09/15 Javascript
nginx常用配置conf的示例代码详解
2022/03/21 Servers
经典《舰娘》游改全新动画预告 预定11月开播
2022/04/01 日漫