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 URL编码和解码使用说明
Apr 12 Javascript
node.js中的fs.symlink方法使用说明
Dec 15 Javascript
jQuery获得document和window对象宽度和高度的方法
Mar 25 Javascript
jQuery鼠标经过方形图片切换成圆边效果代码分享
Aug 20 Javascript
js实现ctrl+v粘贴上传图片(兼容chrome、firefox、ie11)
Mar 09 Javascript
完美的js div拖拽实例代码
Sep 24 Javascript
JS碰撞运动实现方法详解
Dec 15 Javascript
JavaScript实现省市县三级级联特效
May 16 Javascript
vue引用js文件的多种方式(推荐)
May 17 Javascript
微信小程序里引入SVG矢量图标的方法
Sep 20 Javascript
VUE 组件转换为微信小程序组件的方法
Nov 06 Javascript
微信小程序实现底部弹出框
Nov 18 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生成WAP页面
2006/10/09 PHP
php用数组返回无限分类的列表数据的代码
2010/08/08 PHP
Javascript代码混淆综合解决方案-Javascript在线混淆器
2006/12/18 Javascript
jquery入门必备的基本认识及实例(整理)
2013/06/24 Javascript
用Jquery.load载入页面实现局部刷新
2014/01/22 Javascript
jQuery实现html表格动态添加新行的方法
2015/05/28 Javascript
AngularJs表单验证实例详解
2016/05/30 Javascript
JavaScript判断浏览器和hack滚动条的写法
2017/07/23 Javascript
EasyUI Tree树组件无限循环的解决方法
2017/09/27 Javascript
详解Angular6 热加载配置方案
2018/08/18 Javascript
Angular ElementRef简介及其使用
2018/10/01 Javascript
使用JS获取页面上的所有标签
2018/10/18 Javascript
JS中min函数实例讲解
2019/02/18 Javascript
vue2 中二级路由高亮问题及配置方法
2019/06/10 Javascript
微信小程序全选多选效果实现代码解析
2020/01/21 Javascript
[37:45]2014 DOTA2国际邀请赛中国区预选赛5.21 DT VS Orenda
2014/05/22 DOTA
Python使用MySQLdb for Python操作数据库教程
2014/10/11 Python
深入理解Javascript中的this关键字
2015/03/27 Python
Python基于Tkinter实现的记事本实例
2015/06/17 Python
Python栈算法的实现与简单应用示例
2017/11/01 Python
解决pyecharts在jupyter notebook中使用报错问题
2020/04/23 Python
css3实现简单的白云飘动背景特效
2020/10/28 HTML / CSS
html5+css如何实现中间大两头小的轮播效果
2018/12/06 HTML / CSS
香港个人化生活购物网站:Ballyhoo Limited
2016/09/10 全球购物
Linux面试经常问的文件系统操作命令
2016/10/04 面试题
什么是规则表达式
2012/05/03 面试题
毕业生的自我鉴定该怎么写
2013/12/02 职场文书
《罗布泊,消逝的仙湖》教学反思
2014/03/01 职场文书
社区先进事迹材料
2014/05/19 职场文书
工程售后服务方案
2014/06/08 职场文书
基层党组织建设整改方案
2014/09/16 职场文书
2015仓库保管员年终工作总结
2015/05/13 职场文书
出纳试用期工作总结2015
2015/05/28 职场文书
jupyter notebook保存文件默认路径更改方法汇总(亲测可以)
2021/06/09 Python
为什么MySQL 删除表数据 磁盘空间还一直被占用
2021/10/16 MySQL
vue整合百度地图显示指定地点信息
2022/04/06 Vue.js