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 相关文章推荐
在网站上应该用的30个jQuery插件整理
Nov 03 Javascript
extjs 04_grid 单击事件新发现
Nov 27 Javascript
javascript 构造函数强制调用经验总结
Dec 02 Javascript
js获取某元素的class里面的css属性值代码
Jan 16 Javascript
简单易用的倒计时js代码
Aug 04 Javascript
js自定义select下拉框美化特效
May 12 Javascript
微信小程序 绘图之饼图实现
Oct 24 Javascript
关于Angular2 + node接口调试的解决方案
May 28 Javascript
jQuery实现QQ空间汉字转拼音功能示例
Jul 10 jQuery
vue 实现复制内容到粘贴板clipboard的方法
Mar 17 Javascript
jQuery操作cookie的示例代码
Jun 05 jQuery
JQuery Ajax如何实现注册检测用户名
Sep 25 jQuery
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
老照片 - 几十年前的收音机与人
2021/03/02 无线电
PHP 处理图片的类实现代码
2009/10/23 PHP
php生成xml简单实例代码
2009/12/16 PHP
ecshop后台编辑器替换成ueditor编辑器
2015/03/03 PHP
php图像验证码生成代码
2017/06/08 PHP
php服务器的系统详解
2019/10/12 PHP
JSON.stringify 语法实例讲解
2012/03/14 Javascript
使用jQuery内容过滤选择器选择元素实例讲解
2013/04/18 Javascript
js中reverse函数的用法详解
2013/12/26 Javascript
jquery获取复选框被选中的值
2014/04/10 Javascript
优化RequireJS项目的相关技巧总结
2015/07/01 Javascript
jQuery实现可用于博客的动态滑动菜单完整实例
2015/09/17 Javascript
jQuery 1.9.1源码分析系列(十四)之常用jQuery工具
2015/12/02 Javascript
jQuery移动web开发中的页面初始化与加载事件
2015/12/03 Javascript
javascript中this指向详解
2016/04/23 Javascript
jQuery Easyui DataGrid点击某个单元格即进入编辑状态焦点移开后保存数据
2016/08/15 Javascript
Jquery与Bootstrap实现后台管理页面增删改查功能示例
2017/01/22 Javascript
AngularJS实现的回到顶部指令功能实例
2017/05/17 Javascript
p5.js临摹旋转爱心
2019/10/23 Javascript
全面解析js中的原型,原型对象,原型链
2021/01/25 Javascript
tensorflow建立一个简单的神经网络的方法
2018/02/10 Python
PyQt5每天必学之工具提示功能
2018/04/19 Python
详解用python自制微信机器人,定时发送天气预报
2019/03/25 Python
Python3批量生成带logo的二维码方法
2019/06/24 Python
python orm 框架中sqlalchemy用法实例详解
2020/02/02 Python
Django Model中字段(field)的各种选项说明
2020/05/19 Python
Python数据库封装实现代码示例解析
2020/09/05 Python
萨克斯第五大道的折扣店:Saks Fifth Avenue OFF 5TH
2016/08/25 全球购物
Melissa鞋英国官方网站:Nonnon
2019/05/01 全球购物
面临毕业的毕业生自荐书范文
2014/02/05 职场文书
不拖欠农民工工资承诺书
2014/03/31 职场文书
教师党员个人整改措施材料
2014/09/16 职场文书
给老婆道歉的话
2015/01/20 职场文书
民主评议党员个人总结
2015/02/13 职场文书
mysq启动失败问题及场景分析
2021/07/15 MySQL
mysql中如何用命令创建联合唯一索引
2022/04/20 MySQL