热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Bootstrapdatetimepicker

Bootstrap-datetimepicker日期时间选择器示例(下面列出了未搞明白的问题,及版本待优化的问题);jqu

Bootstrap-datetimepicker日期时间选择器示例(下面列出了未搞明白的问题,及版本待优化的问题);

jquery、bootstrap-datetimepicker的css和js也要各位自己引入了。

bootstrap-datetimepicker-ext.css只是自己修改hover时的背景色,和对.old、.new、.disabled字体颜色深浅做了调整。

bootstrap-datetimepicker-ext.css

/*将各按钮hover时的背景色改变;disabled的字体颜色更淡化,直观地知道不能选;*/
.datetimepicker table tr td.old, .datetimepicker table tr td.new {color: #999;
}
.datetimepicker thead tr:first-child th:hover, .datetimepicker tfoot th:hover,
.datetimepicker table tr td .minute:hover, .datetimepicker table tr td .hour:hover,
.datetimepicker table tr td.day:hover, .datetimepicker table tr td .month:hover,
.datetimepicker table tr td .year:hover {background: #00a258;color: #fff;
}
/*让disabled的日期字体颜色更淡,更直观知道不能选;这里还需要加background: none;是保证disabled的背景色样式不被覆盖;*/
.datetimepicker table tr td.disabled,
.datetimepicker table tr td.disabled:hover {background: none;color: #ddd;
}
页面





bootstrap-datetimepicker样式
bootstrap-datetimepicker视图

1.视图只能选到分钟,秒为当前时间的秒数,如何选取秒;
2.input框右侧的日期选择按钮和清空值按钮体验不友好;加了清空值和选取日期按钮为什么对pickerPosition有影响;
3.pickerPosition不能根据控件位置自动决定位置;
4.startDateendDate,到最后十年视图的时候选不到2016,只能点箭头翻页去选;
也就是说,当用户在输入框中输入了不正确的日期,选择器将会尽量解析输入的值,并将解析后的正确值按照给定的格式format设置到输入框中。输入不为日期,返回"1899-12-31",具体格式参考format;输入日期缺少时分秒,参考format以0补全;年月日缺少,则日期返回"1899-12-31";
5.daysOfWeekDisabled可禁止星期几可选;在startDate和endDate之间是否有相应参数可禁止具体日期和日期范围可选;
6.viewSelectNumber or String.(未见到效果) 默认值值: same as minView (supported values are: 'decade', 'year', 'month', 'day', 'hour')
With this option you can select the view from which the date will be selected.
By default it's the last one, however you can choose the first one, so at each click the date will be updated.
7.autoClose可为Boolean和"linked";如果是true的话,"Today" 按钮仅仅将视图转到当天的日期,如果是"linked",当天日期将会被选中。(未看出true和"blinked"的区别)
8.pickerRefererString. 默认值: 'default' (other value available : 'input');The referer element to place the picker for the component implementation. If you want to place the picker just under the input field, just specify input.(没看到效果)
9.手工录入日期时间,无法验证值是否在startDate和endDate之间或者是否为daysOfWeekDisabled,格式是否满足format等等;
10.先选日期1&#xff0c;再选日期3&#xff0c;如果选取日期3 <日期1&#xff0c;则日期2无日期可选取&#xff1b;或者&#xff1a;先选日期3&#xff0c;再选日期1&#xff0c;如果选取日期3 <日期1&#xff0c;则日期2无日期可选取&#xff1b;因为如果不是从日期1 -> 日期2 -> 日期3 或者 日期3 -> 日期2 -> 日期1 或者先选可将日期1和日期3构建关系的日期2&#xff0c;则会造成日期2没得选的情况&#xff0c;所以&#xff1b;日期1和日期3中也要设置其日期关系。
11.日期时间选择器&#xff0c;常用的参数比较固定&#xff1b;是否考虑提供默认参数配置&#xff1b;或自行进行自定义包装方法调用&#xff1b;












推荐阅读
  • php更新数据库字段的函数是,php更新数据库字段的函数是 ... [详细]
  • 使用Maven JAR插件将单个或多个文件及其依赖项合并为一个可引用的JAR包
    本文介绍了如何利用Maven中的maven-assembly-plugin插件将单个或多个Java文件及其依赖项打包成一个可引用的JAR文件。首先,需要创建一个新的Maven项目,并将待打包的Java文件复制到该项目中。通过配置maven-assembly-plugin,可以实现将所有文件及其依赖项合并为一个独立的JAR包,方便在其他项目中引用和使用。此外,该方法还支持自定义装配描述符,以满足不同场景下的需求。 ... [详细]
  • 使用jqTransform插件美化表单
    jqTransform 是由 DFC Engineering 开发的一款 jQuery 插件,专用于美化表单元素,操作简便,能够美化包括输入框、单选按钮、多行文本域、下拉选择框和复选框在内的所有表单元素。 ... [详细]
  • [转]doc,ppt,xls文件格式转PDF格式http:blog.csdn.netlee353086articledetails7920355确实好用。需要注意的是#import ... [详细]
  • javascript分页类支持页码格式
    前端时间因为项目需要,要对一个产品下所有的附属图片进行分页显示,没考虑ajax一张张请求,所以干脆一次性全部把图片out,然 ... [详细]
  • 本文介绍了如何使用 Node.js 和 Express(4.x 及以上版本)构建高效的文件上传功能。通过引入 `multer` 中间件,可以轻松实现文件上传。首先,需要通过 `npm install multer` 安装该中间件。接着,在 Express 应用中配置 `multer`,以处理多部分表单数据。本文详细讲解了 `multer` 的基本用法和高级配置,帮助开发者快速搭建稳定可靠的文件上传服务。 ... [详细]
  • Python 序列图分割与可视化编程入门教程
    本文介绍了如何使用 Python 进行序列图的快速分割与可视化。通过一个实际案例,详细展示了从需求分析到代码实现的全过程。具体包括如何读取序列图数据、应用分割算法以及利用可视化库生成直观的图表,帮助非编程背景的用户也能轻松上手。 ... [详细]
  • 深入剖析Java中SimpleDateFormat在多线程环境下的潜在风险与解决方案
    深入剖析Java中SimpleDateFormat在多线程环境下的潜在风险与解决方案 ... [详细]
  • 在Android平台中,播放音频的采样率通常固定为44.1kHz,而录音的采样率则固定为8kHz。为了确保音频设备的正常工作,底层驱动必须预先设定这些固定的采样率。当上层应用提供的采样率与这些预设值不匹配时,需要通过重采样(resample)技术来调整采样率,以保证音频数据的正确处理和传输。本文将详细探讨FFMpeg在音频处理中的基础理论及重采样技术的应用。 ... [详细]
  • 在Django中提交表单时遇到值错误问题如何解决?
    在Django项目中,当用户提交包含多个选择目标的表单时,可能会遇到值错误问题。本文将探讨如何通过优化表单处理逻辑和验证机制来有效解决这一问题,确保表单数据的准确性和完整性。 ... [详细]
  • WinMain 函数详解及示例
    本文详细介绍了 WinMain 函数的参数及其用途,并提供了一个具体的示例代码来解析 WinMain 函数的实现。 ... [详细]
  • IOS Run loop详解
    为什么80%的码农都做不了架构师?转自http:blog.csdn.netztp800201articledetails9240913感谢作者分享Objecti ... [详细]
  • PTArchiver工作原理详解与应用分析
    PTArchiver工作原理及其应用分析本文详细解析了PTArchiver的工作机制,探讨了其在数据归档和管理中的应用。PTArchiver通过高效的压缩算法和灵活的存储策略,实现了对大规模数据的高效管理和长期保存。文章还介绍了其在企业级数据备份、历史数据迁移等场景中的实际应用案例,为用户提供了实用的操作建议和技术支持。 ... [详细]
  • 本文详细探讨了 jQuery 中 `ajaxSubmit` 方法的使用技巧及其应用场景。首先,介绍了如何正确引入必要的脚本文件,如 `jquery.form.js` 和 `jquery-1.8.0.min.js`。接着,通过具体示例展示了如何利用 `ajaxSubmit` 方法实现表单的异步提交,包括数据的发送、接收和处理。此外,还讨论了该方法在不同场景下的应用,如文件上传、表单验证和动态更新页面内容等,提供了丰富的代码示例和最佳实践建议。 ... [详细]
  • 本文全面解析了JavaScript中的DOM操作,并提供了详细的实践指南。DOM节点(Node)通常代表一个标签、文本或HTML属性,每个节点都具有一个nodeType属性,用于标识其类型。文章深入探讨了DOM节点的创建、查询、修改和删除等操作,结合实际案例,帮助读者更好地理解和掌握DOM编程技术。 ... [详细]
author-avatar
神烟醉_263
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有