温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

bootstrap中datepicker插件默认英文修改为中文的示例分析

发布时间:2021-07-23 09:27:33 阅读:220 作者:小新 栏目:web开发
开发者测试专用服务器限时活动,0元免费领,库存有限,领完即止! 点击查看>>

这篇文章主要介绍了bootstrap中datepicker插件默认英文修改为中文的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

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 = {
 autoclosefalse,
 beforeShowDay: $.noop,
 calendarWeeksfalse,
 clearBtnfalse,
 daysOfWeekDisabled: [],
 endDateInfinity,
 forceParsetrue,
 format'yyyy年mm月dd日',
 keyboardNavigationtrue,
 language'zh-cn',
 minViewMode0,
 multidatefalse,
 multidateSeparator',',
 orientation"auto",
 rtlfalse,
 startDate: -Infinity,
 startView0,
 todayBtnfalse,
 todayHighlightfalse,
 weekStart0
 };

 3、效果如下

bootstrap中datepicker插件默认英文修改为中文的示例分析

感谢你能够认真阅读完这篇文章,希望小编分享的“bootstrap中datepicker插件默认英文修改为中文的示例分析”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!

亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI

开发者交流群×