• Bootstrap日期插件中文实现


    Bootstrap的相关JS和CSS直接跳过。

            <script type="text/javascript" src="static/js/jquery-1.9.1.min.js"></script>
            <script type="text/javascript" src="static/js/bootstrap.min.js"></script>
            <script type="text/javascript" src="static/js/bootstrap-datetimepicker.min.js"></script>
            <script type="text/javascript" src="static/js/bootstrap-datetimepicker.zh-CN.js"></script>
            <link rel="stylesheet" href="static/css/bootstrap.css">
            <link rel="stylesheet" href="static/css/bootstrap-datetimepicker.min.css">
            

    首先定一个中文国际化的JS,如bootstrap-datetimepicker.zh-CN.js

    /**
     * 中文-国际化
     * @param $
     */
    (function($){
        $.fn.datetimepicker.dates['zh-CN'] = {
            days: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'], 
            daysShort: ['周日','周一','周二','周三','周四','周五','周六'],
            daysMin: ['日','一','二','三','四','五','六'],
            months: ['一月','二月','三月','四月','五月','六月', '七月','八月','九月','十月','十一月','十二月'],
            monthsShort: ['一月','二月','三月','四月','五月','六月', '七月','八月','九月','十月','十一月','十二月'],
            today: '今天',
            suffix: [],
            meridiem: [],
            weekStart: 1,
            format: 'yyyy-mm-dd'
        };
    }(jQuery));

    然后初始化日期插件,中文的JS一定要在初始化之前,先引用再初始化

    $(function() {
       //初始化日期插件
        $('.datepicker').datetimepicker({
            language:  'zh-CN',
            weekStart: 1,
            todayBtn:  1,
            autoclose: 1,
            todayHighlight: 1,
            startView: 2,
            minView: 2,
            forceParse: 0,
            pickerPosition:'top-right'//日期插件弹出的位置
        }); });

    最后实现结果如果:

  • 相关阅读:
    latex在vim中的代码片段
    latex设置不同中英文字体
    React 路由基本配置
    React网络请求
    React生命周期函数
    React父子传值中propTypes defaultProps
    React父子组件传值
    React todolist案例和持久化实现
    React表单
    react事件对象 、键盘事件、 表单事件 、ref获取dom节点、React实现类似vue双向数据绑定
  • 原文地址:https://www.cnblogs.com/onlymate/p/6659004.html
Copyright © 2020-2023  润新知