如何在我的日期选择器中获取 DD/MM/YYYY 格式？

Question

我来自西班牙，我需要在我的日期选择器中输入 DD/MM/YYYY 格式，这是代码

 <br> <label for="from">Inicio de castigo </label> <div class='input-group date' id='from'> <input type='text' id="from" name="from" class="form-control" readonly /> <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> </div> <br> <label for="to">Final de castigo </label> <div class='input-group date' id='to'> <input type='text' name="to" id="to" class="form-control" readonly /> <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> </div> <br> <script type="text/javascript"> $(function() { $('#from').datetimepicker({ format: 'DD-MM-YYYY', maxViewMode: 0, language: 'es', daysOfWeekDisabled: '0,6', todayHighlight: true, minDate: new Date(1, 1, 2017), pickTime: false }); $('#to').datetimepicker({ format: 'DD-MM-YYYY', maxViewMode: 0, language: 'es', daysOfWeekDisabled: '0,6', todayHighlight: true, minDate: new Date(1, 1, 2017), pickTime: false }); }); </script>

我在脚本中输入了 MM-DD-YYYY，但是当我选择日历时，他给了我 MM-DD-YYYY 格式，即英国时间。 今天是 2017 年 6 月 7 日，当我打开它时，显示是 2017 年 7 月 6 日。我该如何解决？ 这可能是 datetimepicker.es.js 文件的问题吗？ . 谢谢你们的帮助：）

我在该文件中有更多信息，有我使用的所有脚本

 <script type="text/javascript" src="<?=$base_url?>js/es-ES.js"></script> <script src="<?=$base_url?>js/jquery.min.js"></script> <script src="<?=$base_url?>js/moment.js"></script> <script src="<?=$base_url?>js/bootstrap.min.js"></script> <script src="<?=$base_url?>js/bootstrap-datetimepicker.js"></script> <link rel="stylesheet" href="<?=$base_url?>css/bootstrap-datetimepicker.min.css" /> <script src="<?=$base_url?>js/bootstrap-datetimepicker.es.js"></script>

Answer 1

更改格式：'DD-MM-YYYY' 格式：'DD/MM/YYYY'：

 <script type="text/javascript">
        $(function () {
            $('#from').datetimepicker({   

               format: 'DD/MM/YYYY',
                maxViewMode: 0,
                language: 'es',
                daysOfWeekDisabled: '0,6',
                todayHighlight: true,               
                minDate: new Date(1, 1, 2017),
                pickTime: false

            });
            $('#to').datetimepicker({

                format: 'DD/MM/YYYY',           
                maxViewMode: 0,
                language: 'es',
                daysOfWeekDisabled: '0,6',
                todayHighlight: true,
                minDate: new Date(1, 1, 2017),
                pickTime: false
            });

        });

    </script>

Answer 2

 <script> jQuery(document).ready(function () { jQuery('.datepicker').datetimepicker({ format: 'DD/MM/YYYY' }); jQuery('.datetimepicker').datetimepicker(); }); </script>

Answer 3

你可以合并你的代码并像这样缩短它：

$('#from, #to').datetimepicker({
      format: 'DD/MM/YYYY',
      maxViewMode: 0,
      language: 'es',
      daysOfWeekDisabled: '0,6',
      todayHighlight: true,
      minDate: new Date(1, 1, 2017),
      pickTime: false
});

Answer 4

我刚刚注意到您的代码中有一个错误可能会影响：

 <div class='input-group date' id='from'> <input type='text' id="from" name="from" class="form-control" readonly /> <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> </div> <br> <label for="to">Final de castigo </label> <div class='input-group date' id='to'> <input type='text' name="to" id="to" class="form-control" readonly /> <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> </div>

在这里，您使用了 id“from”和 id“to”的两倍。 id 值必须是唯一的。 它应该在所有代码中只有一个。 在这种情况下，它应该在类“输入组”的 div 中。

看这个例子：

 <div class='input-group date' id='datepicker1'> <input type='text' class="form-control" placeholder="Select preferred meeting date"/> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div>

之后，您可以通过下一个 javascript 代码选择日期选择器的格式：

 <script type="text/javascript"> $(function () { $('#datepicker1').datetimepicker({ viewMode: 'days', format: 'DD/MM/YYYY' }); }); </script>

这应该可以完美运行。 我希望这可以帮助你。

Answer 5

<br>        
<label for="from">Inicio de castigo </label>
<div class='input-group date' id='from'>
    <input type='text' id="from" name="from" class="form-control datepicker" readonly  />
    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</div>

<br>

<label for="to">Final de castigo </label>
<div class='input-group date' id='to'>
    <input type='text' name="to" id="to" class="form-control datepicker" readonly />
    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</div>

<br>




  <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></p>

<script>
  $( function() {
    $( ".datepicker" ).datepicker({
        format: 'DD-MM-YYYY',
        maxViewMode: 0,
        language: 'es',
        daysOfWeekDisabled: '0,6',
        todayHighlight: true,
        minDate: new Date(1, 1, 2017),
        pickTime: false
    });
  } );
</script>