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 相关文章推荐
js 鼠标点击事件及其它捕获
Jun 04 Javascript
js 事件处理函数间的Event物件是否全等
Apr 08 Javascript
推荐30个新鲜出炉的精美 jQuery 效果
Mar 26 Javascript
深入理解JSON数据源格式
Jan 10 Javascript
JavaScript实现带标题的图片轮播特效
May 20 Javascript
js采用concat和sort将N个数组拼接起来的方法
Jan 21 Javascript
详解webpack + vue + node 打造单页面(入门篇)
Sep 23 Javascript
详解webpack性能优化——DLL
Oct 20 Javascript
Vue 开发音乐播放器之歌手页右侧快速入口功能
Aug 08 Javascript
vue.js 双层嵌套for遍历的方法详解, 类似php foreach()
Sep 07 Javascript
解决vue addRoutes不生效问题
Aug 04 Javascript
小程序实现上下切换位置
Nov 16 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.ini 中文版
2006/10/28 PHP
在命令行下运行PHP脚本[带参数]的方法
2010/01/22 PHP
分享PHP函数实现数字与文字分页代码
2015/07/28 PHP
PHP PDOStatement::fetchAll讲解
2019/01/31 PHP
tp5(thinkPHP5框架)时间查询操作实例分析
2019/05/29 PHP
PHP使用PDO、mysqli扩展实现与数据库交互操作详解
2019/07/20 PHP
IE与Firefox下javascript getyear年份的兼容性写法
2007/12/20 Javascript
Safari5中alert的无限循环BUG
2011/04/07 Javascript
Jquery 的扩展方法总结
2011/10/01 Javascript
jquery实现鼠标拖拽滑动效果来选择数字的方法
2015/05/04 Javascript
Javascript之Math对象详解
2016/06/07 Javascript
js 获取本地文件及目录的方法(推荐)
2016/11/10 Javascript
WebPack基础知识详解
2017/01/16 Javascript
微信小程序模板之分页滑动栏
2017/02/10 Javascript
nodejs之get/post请求的几种方式小结
2017/07/26 NodeJs
Vue学习笔记之表单输入控件绑定
2017/09/05 Javascript
JS中原始值和引用值的储存方式示例详解
2018/03/23 Javascript
如何在vue里面优雅的解决跨域(路由冲突问题)
2019/01/20 Javascript
JavaScript 引用类型实例详解【数组、对象、严格模式等】
2020/05/13 Javascript
vue router-link 默认a标签去除下划线的实现
2020/11/06 Javascript
Vue.js桌面端自定义滚动条组件之美化滚动条VScroll
2020/12/01 Vue.js
python访问抓取网页常用命令总结
2017/04/11 Python
python机器学习之决策树分类详解
2017/12/20 Python
Python中最大最小赋值小技巧(分享)
2017/12/23 Python
Python处理菜单消息操作示例【基于win32ui模块】
2018/05/09 Python
详解Django+uwsgi+Nginx上线最佳实战
2019/03/14 Python
基于TensorFlow的CNN实现Mnist手写数字识别
2020/06/17 Python
python 实现单例模式的5种方法
2020/09/23 Python
手对手的教你用canvas画一个简单的海报的方法示例
2018/12/10 HTML / CSS
汽车专业人才自我鉴定范文
2013/12/29 职场文书
个人职业生涯规划书1500字
2013/12/31 职场文书
应届毕业生个人求职自荐信
2014/01/06 职场文书
农民工工资发放承诺书
2014/03/31 职场文书
小小商店教学反思
2014/04/27 职场文书
投标邀请书范本
2015/02/02 职场文书
工作年限证明模板
2015/06/15 职场文书