更改日期选择器语言不起作用

时间:2020-01-11 11:45:34

标签: javascript jquery jquery-ui-datepicker

我一直在尝试更改日期选择器显示的语言。默认为英语,我想使用法语。 我在搜索过程中得到了一些结果,但是似乎没有一个对我有用……我已经尝试了那些1234,{{3 }},但语言仍然没有变化。我猜我在某个地方可能做错了

这是我的代码的简化版本(尚有所有必要的信息):

<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/css/bootstrap-datepicker.css" rel="stylesheet">

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script type="text/javascript" src="{{ asset('main/assets/js/main.js') }} "></script>
        <script type="text/javascript" src="{{ asset('main/assets/js/jquery.min.js') }} "></script>
        <script type="text/javascript" src=" {{ asset('main/assets/js/bootstrap.min.js') }}"></script>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
        <script type="text/javascript" src=" {{ asset('main/assets/js/datepicker-fr.js') }}"> </script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/js/bootstrap-datepicker.js"></script>
</head>
<body>
<input class="date form-control"  type="text" id="datepicker" name="date" placeholder="Définir date limite de disponiblité de cette thématique">

<script>
$(function (){
             $.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );

            $('#datepicker').datepicker({
                autoclose: true,
                format: 'dd-mm-yyyy'
            });
});
</script>
</body>

引用的datepicker-fr.js文件是在5

中找到的文件

根据我在网上发现的内容,我已经依次将脚本更改为:

<script>
$(function (){
         $('#datepicker').datepicker( $.datepicker.regional[ "fr" ] );
});
</script>
<script>
$(function (){
         $.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
         $('#datepicker').datepicker();
});
</script>
<script>
$(function (){
         $.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
         $('#datepicker').datepicker({
             closeText: "Fermer",
             prevText: "Précédent",
             nextText: "Suivant",
             currentText: "Aujourd'hui",
             monthNames: [ "janvier", "février", "mars", "avril", "mai", "juin",
                "juillet", "août", "septembre", "octobre", "novembre", "décembre" ],
             monthNamesShort: [ "janv.", "févr.", "mars", "avr.", "mai", "juin",
                "juil.", "août", "sept.", "oct.", "nov.", "déc." ],
             dayNames: [ "dimanche", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi" ],
             dayNamesShort: [ "dim.", "lun.", "mar.", "mer.", "jeu.", "ven.", "sam." ],
             dayNamesMin: [ "D","L","M","M","J","V","S" ],
             weekHeader: "Sem.",
             dateFormat: "dd/mm/yy",
             firstDay: 1,
             isRTL: false,
             showMonthAfterYear: false,
             yearSuffix: "" 
         });
});
</script>

日期仍以英文显示,控制台上没有出现问题。我在这里想念什么?非常感谢您的帮助

1 个答案:

答案 0 :(得分:2)

只需包含jQuery-Ui并将fr设置为默认语言,当然在init之前

$(function() {
  $.datepicker.regional['fr'] = {
    closeText: "Fermer",
    prevText: "Précédent",
    nextText: "Suivant",
    currentText: "Aujourd'hui",
    monthNames: ["janvier", "février", "mars", "avril", "mai", "juin",
      "juillet", "août", "septembre", "octobre", "novembre", "décembre"
    ],
    monthNamesShort: ["janv.", "févr.", "mars", "avr.", "mai", "juin",
      "juil.", "août", "sept.", "oct.", "nov.", "déc."
    ],
    dayNames: ["dimanche", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi"],
    dayNamesShort: ["dim.", "lun.", "mar.", "mer.", "jeu.", "ven.", "sam."],
    dayNamesMin: ["D", "L", "M", "M", "J", "V", "S"],
    weekHeader: "Sem.",
    dateFormat: "dd/mm/yy",
    firstDay: 1,
    isRTL: false,
    showMonthAfterYear: false,
    yearSuffix: ""
  };
  $.datepicker.setDefaults($.datepicker.regional['fr']);

  $('#datepicker').datepicker();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" integrity="sha256-rByPlHULObEjJ6XQxW/flG2r+22R5dKiAoef+aXWfik=" crossorigin="anonymous" />
<input id="datepicker" />