【问题标题】:Set current day active on datepickers with Jquery使用 Jquery 在日期选择器上设置当前日期
【发布时间】:2016-02-29 09:12:11
【问题描述】:

我在日期选择器上设置正确日期时遇到了一个小问题。 不知何故,文本框中显示的日期不是日期选择器中的正确日期。

代码文本框:

<div class="small-12 medium-6 large-3 columns">
    @Html.Label("Departure Date:", new { @class = "label-travel" })
    @Html.TextBoxFor(m => m.DepartureDate, new { Value = Model.DepartureDate.ToShortDateString(), @class = "textbox", @id = "departureDate" })
</div>

<div class="small-12 medium-6 large-3 columns">
   @Html.Label("Return Date:", new { @class = "label-travel" })
   @Html.TextBoxFor(m => m.ReturnDate, new { Value = Model.ReturnDate.ToShortDateString(), @class = "textbox", @id = "returnDate" }) 
</div>

var currentDay = ??
var currentDayPlusOne = ??

$("#departureDate").datepicker({
    dateformat: "yy-dd-mm"
});

$("#returnDate").datepicker({
    dateformat: "yy-dd-mm"
});

为了在我的日期选择器中设置当前日期,我应该写什么,所以文本框的日期是 2015-26-15 而前一天是 2015-27-15?

希望有人能告诉我。

【问题讨论】:

标签: jquery datepicker


【解决方案1】:

检查这个sn-p:

在这里,setDate 设置今天的日期,dateFormat 定义您要显示的格式。

var currentDate = new Date();  
var tomrw = new Date(new Date().getTime() + 24 * 60 * 60 * 1000);
$("#departureDate").datepicker({ dateFormat: "yy-dd-mm"}).datepicker("setDate", new Date());
$("#returnDate").datepicker({ dateFormat: "yy-dd-mm"}).datepicker("setDate", tomrw);
<link href="https://code.jquery.com/ui/1.9.2/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.9.2/jquery-ui.js"></script>
Departure date:
<input type="text" id="departureDate" />
Return date:
<input type="text" id="returnDate" />

您也可以使用setDate : 1 来设置明天的日期。因为值 1 意味着它是从当前日期开始的一天。如果您想将出发日期从当前日期算起 10 天,您可以使用setDate : 10

【讨论】:

  • 有效.. 但是调用 datepicker 2 次是否正确?
  • @Mandersen 当然,您可以在不同的元素上多次调用datepicker()。查看 jquery datepicker 示例上的 Date Range 示例,该示例使用 fromto 字段作为日期选择器。
【解决方案2】:

你可以这样做:

<script>
                $("#departureDate").datepicker().datepicker("setDate", new Date());

            $("#returnDate").datepicker().datepicker("setDate", new Date());
</script>

【讨论】:

  • 第二个日期选择器与第一个执行相同的操作,并且 OP 希望将 returnDate 设置为与今天的日期相隔一天。所以你的代码不起作用。 ;(
  • @Lucky 我知道,但对此没有任何规范。所以我没有为此添加代码。
猜你喜欢
  • 2021-11-05
  • 2014-12-07
  • 2019-11-24
  • 2016-04-29
  • 2011-04-09
  • 2012-11-20
  • 1970-01-01
  • 2017-08-11
  • 1970-01-01
相关资源
最近更新 更多