2017年2月28日手记---bootstrap日期选择器

来源:互联网 发布:网络监控技术方案 编辑:程序博客网 时间:2024/05/16 07:17

今天在写网页时需要用到时间选择器这个控件,这让我想起了<input/>自带的'date'类型,这也是个时间选择器,哈哈,秒写,结果发下这个东西IE不支持,好吧果断删除,现在有两条路给我选:1.自己写一个时间选择器(发现我没有这么叼)。2.去网上找插件,bootstrap正好有提供这个时间选择器控件而且很叼果断下载依赖包,而且很人性化的是依赖包里面还有案例,我参考着案例将需要的文件拉进自己的项目中:http://www.bootcss.com/p/bootstrap-datetimepicker/ 这个连接是bootstap时间选择器的下载包地址API也在这里,我很快就写好了代码,html代码我就不贴上去了(官网上有示例)我就贴个我JS的代码的,因为我今天重点回顾那个部分,好上代码:

        $('#datetimepickerStart').datetimepicker({            format: "yyyy-mm-dd",//要输出的时间格式            todayBtn: true,//today这个按钮是否显示            language: 'ch',//语言格式            autoclose: true,//选定一个日期后自动关闭选择器            minView: "month"//最小/最后的View,就是最后一个View这行的意思是选完day后选项框不再显示,(个人理解就是month这个View是负责显示day的)        });

这些代码都很简单,在我上面给的链接里的网站上都有,主要讲的是语言问题:我上面写到的语言这一属性中我用的是‘ch’,不错这个ch代表的是中文,这个不是它自带的而是我自己写的,我发现它那里提供了'en','de','br','es'就是没有'ch',这是很相信中国的程序员有能力自己写啊,所以,我果断自己写一个,我在想这个于有关语言的显示的肯定在js里面,所以我就去js 里找,后来果然被我找到了 ,我模仿他的实例自己写了一个,好吧,不想吹牛了上了代码睡觉去:

    ch: {      days:        ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'],      daysShort:   ['周日', '周一', '周二', '周三', '周四', '周五', '周六', '周日'],      daysMin:     ['日', '一', '二', '三', '四', '五', '六', ''],      months:      ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],      monthsShort: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],      meridiem:    ['上午', '下午'],      suffix:      ['st', 'nd', 'rd', 'th'],      today:       'Today',      clear:       'Clear'      }



0 0
原创粉丝点击