bootstrap datepicker插件默认英文修改为中文


Posted in Javascript onJuly 28, 2017

datepicker插件默认为英文,而且格式为:mm/dd/yyyy这种情况,看起来不怎么直观。

修改目标:

1、默认显示为中文 

2、格式为:yyyy年mm月dd日 

需要修改两个地方:

1、更改datas对象, 增加zh-cn语言选项;参见源代码的1419行

var dates = $.fn.datepicker.dates = {
 en: {
  days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"],
  daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
  daysMin: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"],
  months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
  monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
  today: "Today",
  clear: "Clear"
 },
  "zh-cn":{
  days: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"],
  daysShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],
  daysMin: ["日", "一", "二", "三", "四", "五", "六", "日"],
  months: ["一月份", "二月份", "三月份", "四月份", "五月份", "六月份", "七月份", "八月份", "九月份", "十月份", "十一月份", "十二月份"],
  monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
  today: "今天",
  clear: "清空"
 }
 };

红色部分为新增部分。

2、修改默认参数,即defaults对象。      

var defaults = $.fn.datepicker.defaults = {
 autoclose: false,
 beforeShowDay: $.noop,
 calendarWeeks: false,
 clearBtn: false,
 daysOfWeekDisabled: [],
 endDate: Infinity,
 forceParse: true,
 format: 'yyyy年mm月dd日',
 keyboardNavigation: true,
 language: 'zh-cn',
 minViewMode: 0,
 multidate: false,
 multidateSeparator: ',',
 orientation: "auto",
 rtl: false,
 startDate: -Infinity,
 startView: 0,
 todayBtn: false,
 todayHighlight: false,
 weekStart: 0
 };

 3、效果如下

bootstrap datepicker插件默认英文修改为中文

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 学习小结(适合新手参考)
Jul 30 Javascript
自己的js工具_Form 封装
Aug 21 Javascript
JavaScript实现拼音排序的方法
Nov 20 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
Jul 10 Javascript
JS+CSS设置img在DIV中只显示Img垂直居中的部分
Oct 24 Javascript
javascript 数组排序函数sort和reverse使用介绍
Nov 21 Javascript
判断在css加载完毕后执行后续代码示例
Sep 03 Javascript
Nginx上传文件全部缓存解决方案
Aug 17 Javascript
基于js粘贴事件paste简单解析以及遇到的坑
Sep 07 Javascript
Nuxt项目支持eslint+pritter+typescript的实现
May 20 Javascript
详解vuex之store源码简单解析
Jun 13 Javascript
vue登录注册实例详解
Sep 14 Javascript
基于BootStrap multiselect.js实现的下拉框联动效果
Jul 28 #Javascript
基于JS实现移动端左滑删除功能
Jul 28 #Javascript
Vue2.0 多 Tab切换组件的封装实例
Jul 28 #Javascript
webpack实现热更新(实施同步刷新)
Jul 28 #Javascript
BootStrap Fileinput上传插件使用实例代码
Jul 28 #Javascript
解决React Native端口号修改的方法
Jul 28 #Javascript
vue+vux实现移动端文件上传样式
Jul 28 #Javascript
You might like
php过滤敏感词的示例
2014/03/31 PHP
php将远程图片保存到本地服务器的实现代码
2015/08/03 PHP
对PHP依赖注入的理解实例分析
2016/10/09 PHP
自制PHP框架之路由与控制器
2017/05/07 PHP
PHP使用PhpSpreadsheet操作Excel实例详解
2020/03/26 PHP
关于实现代码语法标亮 dp.SyntaxHighlighter
2007/02/02 Javascript
DWZ table的原生分页浅谈
2013/03/01 Javascript
jquery弹窗插件colorbox绑定动态生成元素的方法
2014/06/20 Javascript
javascript实现点击按钮弹出一个可关闭层窗口同时网页背景变灰的方法
2015/05/13 Javascript
如何实现移动端浏览器不显示 pc 端的广告
2015/10/15 Javascript
图片旋转、鼠标滚轮缩放、镜像、切换图片js代码
2020/12/13 Javascript
基于JS实现翻书效果的页面切换样式
2017/02/16 Javascript
vue2.0 子组件改变props值,并向父组件传值的方法
2018/03/01 Javascript
小程序实现人脸识别功能(百度ai)
2018/12/23 Javascript
vue之debounce属性被移除及处理详解
2019/11/13 Javascript
uni-app如何实现增量更新功能
2020/01/03 Javascript
vue脚手架项目创建步骤详解
2021/03/02 Vue.js
[00:36]DOTA2勇士令状莱恩声望物品——冥晶之厄展示
2018/05/25 DOTA
Python中非常实用的一些功能和函数分享
2015/02/14 Python
Python中的anydbm模版和shelve模版使用指南
2015/07/09 Python
python3.7简单的爬虫实例详解
2019/07/08 Python
python 的topk算法实例
2020/04/02 Python
css3中background新增的4个新的相关属性用法介绍
2013/09/26 HTML / CSS
html5 web本地存储将取代我们的cookie
2012/12/26 HTML / CSS
人力资源部培训专员岗位职责
2014/01/02 职场文书
酒店前厅员工辞职信
2014/01/08 职场文书
中专毕业生自我鉴定
2014/02/02 职场文书
环保建议书
2014/03/12 职场文书
大学自主招生推荐信
2014/05/10 职场文书
2015年六一儿童节演讲稿
2015/03/19 职场文书
同意离婚答辩状
2015/05/22 职场文书
2015大学迎新标语
2015/07/16 职场文书
生活委员竞选稿
2015/11/21 职场文书
2019年英语版感谢信(8篇)
2019/09/29 职场文书
用Python制作灯光秀短视频的思路详解
2021/04/13 Python
JavaScript实现酷炫的鼠标拖尾特效
2022/02/18 Javascript