今夜IT网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
查看: 223|回复: 0

[PHP相关] 基于Bootstrap Datetimepicker联动

[复制链接]

68

主题

68

帖子

312

积分

骑士

积分
312
发表于 2017-8-10 15:31:46 | 显示全部楼层 |阅读模式
先看一下层级联动的案例
先选择前面时间后后面的时间不要超过前面的时间
先选择后面的时间后,前面的时间不要少于后面的时间
下面看封装代码

函数initDateTimePicker(startTime,endTime,timeFormat,minview){
  $(开始时间).datetimepicker( “删除”);
  $(开始时间).datetimepicker({
    language:sessionStorage.getItem(“lang”),
    autoclose:true,
    今天高光:真,
    endDate:new Date(),
    格式:timeFormat,
    startView:minview,
    minView:minview,
  })。on(“changeDate”,function(){
    var value = $(startTime).val();
    $(结束时间).datetimepicker( “删除”);
    $(结束时间).datetimepicker({
      language:sessionStorage.getItem(“lang”),
      autoclose:true,
      今天高光:真,
      endDate:new Date(),
      startDate:value,
      格式:timeFormat,
      startView:minview,
      minView:minview,
    })
  });
  $(结束时间).datetimepicker( “删除”);
  $(结束时间).datetimepicker({
    language:sessionStorage.getItem(“lang”),
    autoclose:true,
    今天高光:真,
    endDate:new Date(),
    格式:timeFormat,
    startView:minview,
    minView:minview,
  })。on(“changeDate”,function(){
    var value = $(endTime).val();
    $(开始时间).datetimepicker( “删除”);
    $(开始时间).datetimepicker({
      language:sessionStorage.getItem(“lang”),
      autoclose:true,
      今天高光:真,
      endDate:value,
      格式:timeFormat,
      startView:minview,
      minView:minview,
    })
  });
}
初始化datetimepicker及起止时间双向联动公共方法startTime:起始时间输入框id号,例如:'#archiveStartTime'
endTime:结束时间输入框id号,例如:'#archiveEndTime'timeFormat:时间格式,例如:'yyyy-mm-dd'
minview:最先显示时间或者层级

网站北京建设[url]http://www.wangzhanjianshegs.com/[/url]

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回列表 官方QQ群

QQ|小黑屋|手机版|今夜IT网 (京ICP备11034012号) 

Powered by Discuz! X3.2

快速回复 返回顶部 返回列表