Question

我正在尝试实现bootstrap-datepicker.js插件。（https://bootstrap-datepicker.readthedocs.io/en/latest/）我已经有了.js和.css文件，但是我得到了这个中文的丑陋标准jquery datepicker：

$('#test').datepicker({ });

我该如何解决？

我的代码：

<input type="text" id="test" name="test" class="sm-form-control" placeholder="DD-MM-JJJJ" autocomplete="off">    

$(document).ready(function () {
    $('#test').datepicker({
         onSelect: function(d,i){
              if(d !== i.lastVal){
                  $(this).change();
              }
         }
    });
    $('#test').change(function(){
         console.log('Test');
    });
});

谢谢，迈克

Answer 1

JQueryUI检查Check this link

在Bootstrap和datepicker之间存在冲突

$.fn.datepicker.noConflict = function(){
 $.fn.datepicker = old;
  return this;
  };

或者您可以使用JQuery-UI

$( function() {
    $( "#test" ).datepicker({
    language: 'zh-TW'
    });     
  });

<meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
   <script src="i18n/datepicker-zh-TW.js"></script>
<body>
 
<p>Date:<input type="text" id="test" name="test" class="sm-form-control" placeholder="DD-MM-JJJJ" autocomplete="off">    

 </body>

Answer 2

该插件在月份中支持i18n，weekday名称和weekStart选项。

默认为英语（en）；其他可用的翻译在 js / locales / 目录中，只需在插件后添加所需的语言环境即可。

要添加更多语言，只需在调用.datepicker（）之前在$ .fn.datepicker.dates中添加一个键即可。示例：

$.fn.datepicker.dates['en'] = {
days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
daysMin: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
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",
format: "mm/dd/yyyy",
titleFormat: "MM yyyy", /* Leverages same syntax as 'format' */
weekStart: 0

};

从右到左的语言还可以包含rtl：true，以使日历正确显示。

如果您的浏览器（或您的用户的浏览器）显示的字符错误，则可能是浏览器正在加载具有非Unicode编码的javascript文件。只需将charset =“ UTF-8”添加到您的脚本标签：

<script src="bootstrap-datepicker.XX.js" charset="UTF-8"></script>

  $('.datepicker').datepicker({
    language: 'en'
   });

丑陋的引导日期选择器

2 个答案: