使用jquery从datepicker中选择日期时显示日期名称

时间:2018-05-07 06:41:38

标签: javascript php jquery

我想在动态地从datepicker中选择日期时显示日期名称。当用户从datepicker中选择特定日期时,我想显示它是动态的那一天。如何从datepicker中获取日期。这是代码。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
$(function() {
    var date = new Date();
    var dayNo = date.getDay();
    var mindate = (7-dayNo);
    $( "#datepicker" ).datepicker({
         dateFormat: 'yy-mm-dd', firstDay: 1,minDate: mindate

    });
});
</script>
<input type="text" id="datepicker">

2 个答案:

答案 0 :(得分:0)

onSelect与您要显示的自定义日期[数组]一起使用。

$(function() {
  var date = new Date();
  var dayNo = date.getDay();
  var mindate = (7 - dayNo);
  var d = ['sun', 'mon', 'tue', 'wed', 'th', 'fr', 'sat' ];
     
  $("#datepicker").datepicker({
    dateFormat: 'yy-mm-dd',
    firstDay: 1,
    minDate: mindate,
    onSelect: function(dateText, inst) {
      var today = new Date(dateText);
      console.log(d[today.getDay()]);
      $('#datepicker').val(dateText + '  ' +d[today.getDay()]);//If you only want day remove dateText concat part
    }

  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<input type="text" id="datepicker">

答案 1 :(得分:0)

你可以试试这个。我希望它会对你有所帮助:

<input id="datepicker" type="text">
<p class="name"></p>
    $( document ).ready(function() {
                $("#datepicker").datepicker({
                    dateFormat: "dd-mm-yy",
                    onSelect: function(dateText, inst) {
                        var date = $.datepicker.parseDate(inst.settings.dateFormat || $.datepicker._defaults.dateFormat, dateText, inst.settings);
                        var dateText = $.datepicker.formatDate("DD", date, inst.settings);
                        $("p.name").html( "Day Name= " + dateText ); // Just the day of week
                    }
                });
            });