BootStrap Datepicker 插件修改为默认中文的实现方法


Posted in Javascript onFebruary 10, 2017

bootstrap-datepicker 是一个非常优秀的时间选择插件,默认是英文显示日期的,通过下面几个小修改让其支持默认中文

1、首先将 bootstrap-datepicker.js 另存为 utf-8 格式保存

2、增加 cn 语言选项 

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"
    },
    cn: {
      days: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],
      daysShort: ["日", "一", "二", "三", "四", "五", "六", "七"],
      daysMin: ["日", "一", "二", "三", "四", "五", "六", "七"],
      months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
      monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
      today: "今天",
      clear: "清除"
    }
  };

红色部分为增加的语言选项

3、修改默认参数,默认语言为 cn 

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

红色部分为修改的默认语言

至此完成默认中文的修改,效果如下图:

BootStrap Datepicker 插件修改为默认中文的实现方法

以上所述是小编给大家介绍的BootStrap Datepicker 插件修改为默认中文的实现方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript国旗变换效果代码
Aug 13 Javascript
理解Javascript_05_原型继承原理
Oct 13 Javascript
基于jQuery的让非HTML5浏览器支持placeholder属性的代码
May 24 Javascript
JS左右无缝滚动(一般方法+面向对象方法)
Aug 17 Javascript
Js冒泡事件详解及阻止示例
Mar 21 Javascript
js实现键盘操作实现div的移动或改变的原理及代码
Jun 23 Javascript
js通过location.search来获取页面传来的参数
Sep 11 Javascript
jquery彩色投票进度条简单实例演示
Jul 23 Javascript
jquery+html仿翻页相册功能
Dec 20 Javascript
javascript 中null和undefined区分和比较
Apr 19 Javascript
Vue网页html转换PDF(最低兼容ie10)的思路详解
Aug 24 Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
Jul 26 jQuery
BootStrap Datetimepicker 汉化的实现代码
Feb 10 #Javascript
解决URL地址中的中文乱码问题的办法
Feb 10 #Javascript
tablesorter.js表格排序使用方法(支持中文排序)
Feb 10 #Javascript
jquery.tableSort.js表格排序插件使用方法详解
Aug 12 #Javascript
TableSort.js表格排序插件使用方法详解
Feb 10 #Javascript
微信小程序 JS动态修改样式的实现代码
Feb 10 #Javascript
基于jQuery实现简单人工智能聊天室
Feb 10 #Javascript
You might like
php实现利用phpexcel导出数据
2013/08/24 PHP
用 Composer构建自己的 PHP 框架之基础准备
2014/10/30 PHP
PHP7.0连接DB操作实例分析【基于mysqli】
2019/09/26 PHP
文本链接逐个出现的js脚本
2007/12/12 Javascript
JavaScript 版本自动生成文章摘要
2008/07/23 Javascript
JavaScript this 深入理解
2009/07/30 Javascript
Node调试工具JSHint的安装及配置教程
2014/05/27 Javascript
javascript去除字符串左右两端的空格
2015/02/05 Javascript
JavaScript获取DOM元素的11种方法总结
2015/04/25 Javascript
JavaScript SHA512&SHA256加密算法详解
2015/08/11 Javascript
JavaScript截取指定长度字符串点击可以展开全部代码
2015/12/04 Javascript
Bootstrap+jfinal退出系统弹出确认框的实现方法
2016/05/30 Javascript
漫谈JS引擎的运行机制 你应该知道什么
2016/06/15 Javascript
Vue.js使用v-show和v-if的注意事项
2016/12/13 Javascript
JS控件bootstrap suggest plugin使用方法详解
2017/03/25 Javascript
Vue实现typeahead组件功能(非常靠谱)
2017/08/26 Javascript
JS中用EL表达式获取上下文参数值的方法
2018/03/28 Javascript
javascript创建元素和删除元素实例小结
2019/06/19 Javascript
Vue中jsx不完全应用指南小结
2019/11/01 Javascript
用Python编写一个简单的Lisp解释器的教程
2015/04/03 Python
使用Python导出Excel图表以及导出为图片的方法
2015/11/07 Python
Python xlwt设置excel单元格字体及格式
2020/04/18 Python
python正则实现提取电话功能
2018/02/24 Python
pandas 取出表中一列数据所有的值并转换为array类型的方法
2018/04/11 Python
Python实现的tcp端口检测操作示例
2018/07/24 Python
Python TestCase中的断言方法介绍
2019/05/02 Python
Python3 Tkinter选择路径功能的实现方法
2019/06/14 Python
如何基于pythonnet调用halcon脚本
2020/01/20 Python
keras的ImageDataGenerator和flow()的用法说明
2020/07/03 Python
使用Python中tkinter库简单gui界面制作及打包成exe的操作方法(二)
2020/10/12 Python
香港演唱会订票网站:StubHub香港
2019/10/10 全球购物
Ibatis如何调用存储过程
2015/05/15 面试题
2014年学校禁毒工作总结
2014/12/23 职场文书
硕士毕业论文导师评语
2014/12/31 职场文书
高中军训感想
2015/08/07 职场文书
Redis缓存-序列化对象存储乱码问题的解决
2021/06/21 Redis