jQuery UI datepickers一键获取日期和日期名称[关闭]答案

【问题标题】：jQuery UI datepickers get date and day name on one click [closed]jQuery UI datepickers一键获取日期和日期名称[关闭]
【发布时间】：2017-10-22 21:19:02
【问题描述】：

我通过 jQuery UI 使用 datepicker 来获取完整的日期和日期。但现在我想在日历上单击来做到这一点。这是我的示例代码：

<script>
$(function(){
    var pickerOpts1 = {
        dateFormat: "yy-mm-dd"
    };
    var pickerOpts2 = {
        dateFormat: "DD"
    };
    $("#datepicker1").datepicker(pickerOpts1);
    $("#datepicker2").datepicker(pickerOpts2);
});
</script>

字段很简单：

<form  method="get" action="check.php">
    <p>date: <input type="text" name="dateH" id="datepicker1" /></p>
    <p>day: <input type="text" name="dayD" id="datepicker2" /></p>
    <button class="btn btn-primary" type="submit">Submit</button>
</form>

我们将不胜感激任何和所有的帮助！

【问题讨论】：

你的问题到底是什么？
问题是我想让fullday和day在日历选择的时候同时出现在输入框中。
哇..!!!! @FerhadOthman 谢谢老兄......我想要的......像魅力一样工作。

标签： javascript jquery html jquery-ui datepicker

【解决方案1】：

这里有一个解决方案https://jsfiddle.net/0g4runLb/

$(function(){
  var pickerOpts1 = {
      dateFormat: "yy-mm-dd",
      onSelect: function(dateText, inst) {
        var date = $(this).datepicker('getDate');
        $('#datepicker2').val($.datepicker.formatDate('DD', date));
      }
  };
  $("#datepicker1").datepicker(pickerOpts1);
});

<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<form  method="get" action="check.php">
  <p>date: <input type="text" name="dateH" id="datepicker1" /></p>
  <p>day: <input type="text" name="dayD" id="datepicker2" /></p>
  <button class="btn btn-primary" type="submit">Submit</button>
</form>

希望这会对你有所帮助。

【讨论】：

很好...这就是我想要的...谢谢兄弟...
@AmirAmirul 欢迎好友:) 请接受答案。

【解决方案2】：

这是一个可以帮助你的例子：

<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>
<script>
$(function() {
  $('#datepicker1').datepicker({
    onSelect: function(date){
      var dayNames = ["Sunday","Monday","Tuesday","Wednesday","Thursday", "Friday","Saturday"];
      var d=new Date(date).getDay();
      $('#datepicker2').val(dayNames[d]);
    },
    dateFormat:'yy-mm-dd'
  })
});
</script>


<form  method="get" action="check.php">
   <p>date: <input type="text" name="dateH" id="datepicker1" /></p>
   <p>day: <input type="text" name="dayD" id="datepicker2" /></p>
   <button class="btn btn-primary" type="submit">Submit</button>
</form>

【讨论】：