时间戳

首页 > 解决方案 > 如何使用基于时区的 JqueryUI 更改日期格式？

html - 如何使用基于时区的 JqueryUI 更改日期格式？

问题描述

我有使用 JqueryUI 的日期选择器代码，我想使用我的时区（SA 区域）。日期格式应该是 'dd-mm-yy' 但我的文本字段上的 UI 是 01/08/2020。这是这样做的正确格式吗，请协助更好地改进这一点，谢谢。

<!---DatePicker for startDate and endDate.
   ----> 
   <div class="d-flex justify-content-start">
   <div class = "col-xl-10.5 col-lg-10.5 col-md-10 col-sm-10.5 col-10.5">
 <div class="input-daterange input-group" id="datepicker">
   <input type="text" class="input-sm form-control" name="from" placeholder="startdate"/>
   <span class="input-group-addon">To</span>
   <input type="text" class= "input-sm form-control" placeholder="enddate"/>
   </div>
   </div>
  </div><br/>

// date functionality
  $(document).ready(function(){
  $('.input-daterange').datepicker({
   dateFormat: "dd-mm-yy",
    autoclose:true

    });
  });

标签： htmljquery-ui

解决方案

我使用 jQuery UI 设置了以下测试。

$(function() {
  // date functionality
  $.datepicker.setDefaults($.datepicker.regional["sa"]);
  $('.input-daterange input').datepicker({
    dateFormat: "dd-mm-yy"
  });
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.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>
<div class="d-flex justify-content-start">
  <div class="col-xl-10.5 col-lg-10.5 col-md-10 col-sm-10.5 col-10.5">
    <div class="input-daterange input-group" id="datepicker">
      <input type="text" class="input-sm form-control" name="from" placeholder="startdate" />
      <span class="input-group-addon">To</span>
      <input type="text" class="input-sm form-control" placeholder="enddate" />
    </div>
  </div>
</div>
<br/>

该$.datepicker.regional属性包含一个本地化数组，由语言代码索引，并""引用默认值（英语）。每个条目都是具有以下属性的对象：closeText, prevText, nextText, currentText, monthNames, monthNamesShort, dayNames, dayNamesShort, dayNamesMin, weekHeader, dateFormat, firstDay, isRTL, showMonthAfterYear, 和yearSuffix.

推荐阅读