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 动态添加表格行
Jun 22 Javascript
些很实用且必用的小脚本代码
Jun 26 Javascript
javascript延时重复执行函数 lLoopRun.js
Jun 29 Javascript
jQuery响应鼠标事件并隐藏与显示input默认值
Aug 24 Javascript
js多个物体运动功能实例分析
Dec 20 Javascript
javascript history对象详解
Feb 09 Javascript
JS 组件系列之Bootstrap Table的冻结列功能彻底解决高度问题
Jun 30 Javascript
基于JS实现仿京东搜索栏随滑动透明度渐变效果
Jul 10 Javascript
JS实现移动端判断上拉和下滑功能
Aug 07 Javascript
jQuery简单实现根据日期计算星期几的方法
Jan 09 jQuery
JS检测浏览器开发者工具是否打开的方法详解
Oct 02 Javascript
vue如何使用rem适配
Feb 06 Vue.js
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中路径问题的解决方案
2006/10/09 PHP
操作Oracle的php类
2006/10/09 PHP
PHP生成Flash动画的实现代码
2010/03/12 PHP
Thinkphp3.2.3整合phpqrcode生成带logo的二维码
2016/07/21 PHP
thinkPHP5框架接口写法简单示例
2019/08/05 PHP
web前端开发也需要日志
2010/12/09 Javascript
jQuery幻灯片特效代码分享--鼠标滑过按钮时切换(2)
2020/11/18 Javascript
js游戏人物上下左右跑步效果代码分享
2015/08/28 Javascript
【经典源码收藏】jQuery实用代码片段(筛选,搜索,样式,清除默认值,多选等)
2016/06/07 Javascript
如何将你的AngularJS1.x应用迁移至React的方法
2018/02/01 Javascript
基于vue v-for 循环复选框-默认勾选第一个的实现方法
2018/03/03 Javascript
浅谈Node.js 中间件模式
2018/06/12 Javascript
layer.js open 隐藏滚动条的例子
2019/09/05 Javascript
vue 里面的 $forceUpdate() 强制实例重新渲染操作
2020/09/21 Javascript
一个基于flask的web应用诞生 用户注册功能开发(5)
2017/04/11 Python
Python callable()函数用法实例分析
2018/03/17 Python
python如何拆分含有多种分隔符的字符串
2018/03/20 Python
致Python初学者 Anaconda入门使用指南完整版
2018/04/05 Python
flask中过滤器的使用详解
2018/08/01 Python
在python中使用with打开多个文件的方法
2019/01/07 Python
Django框架实现分页显示内容的方法详解
2019/05/10 Python
pandas删除行删除列增加行增加列的实现
2019/07/06 Python
pandas中遍历dataframe的每一个元素的实现
2019/10/23 Python
对tensorflow中的strides参数使用详解
2020/01/04 Python
Python列表解析操作实例总结
2020/02/26 Python
利用Python实现朋友圈中的九宫格图片效果
2020/09/03 Python
pytho matplotlib工具栏源码探析一之禁用工具栏、默认工具栏和工具栏管理器三种模式的差异
2021/02/25 Python
突袭HTML5之Javascript API扩展4—拖拽(Drag/Drop)概述
2013/01/31 HTML / CSS
微软巴西官方网站:Microsoft Brasil
2019/09/26 全球购物
一名女生的自荐信
2013/12/08 职场文书
员工拓展培训方案
2014/02/15 职场文书
食品安全处置方案
2014/06/14 职场文书
高中地理教学反思
2016/02/19 职场文书
SpringBoot快速入门详解
2021/07/21 Java/Android
一条慢SQL语句引发的改造之路
2022/03/16 MySQL
MySQL实战记录之如何快速定位慢SQL
2022/03/23 MySQL