将日期输入类型默认值设置为 Today、Tomorrow、Anydate？

Posted 2023-02-25

【中文标题】将日期输入类型默认值设置为 Today、Tomorrow、Anydate？

【英文标题】：Set date input type default value to Today, Tomorrow, Anydate?

【发布时间】：2014-02-16 21:04:55

【问题描述】：

在 html5 中，没有在 value 属性中指定“today”的本地方式。这是我非常喜欢的 jQuery 代码。如何将此代码扩展为设置

今天的日期到var today 明天的日期到var tomorrow 计算到var anydate 的任何日期（从var today 计算/启动？）

并相应地定义以下 3 个 id-s：

#theDate #theTomorrow #theAnydate

HTML

<input type="date" id="theDate">

jQuery

$(document).ready(function() 
    var date = new Date();

    var day = date.getDate();
    var month = date.getMonth() + 1;
    var year = date.getFullYear();

    if (month < 10) month = "0" + month;
    if (day < 10) day = "0" + day;

    var today = year + "-" + month + "-" + day;       
    $("#theDate").attr("value", today);
);

demo

【问题讨论】：

Here are some examples of how you could able to add default date or customize date using jquery and javascript.

【参考方案1】：

我找到了非常简单的解决方案：

echo (new DateTime('tomorrow'))->format('Y-m-d'); //-- For tomorrow
echo (new DateTime())->format('Y-m-d'); //-- For today

【参考方案2】：

使用 toISOString()，它总是返回一个“Z”时区 ISO8601 字符串，并将其截断为日期。

var todayUTC = new Date().toISOString().substr(0,10);

var todayLocal = new Date(new Date().getTime() - new Date().getTimezoneOffset() * 60 * 1000).toISOString().substr(0,10);

var tomorrowLocal = new Date(new Date().getTime() + 24 * 60 * 60 * 1000 - new Date().getTimezoneOffset() * 60 * 1000).toISOString().substr(0,10);

【参考方案3】：

与任何 HTML 输入字段一样，浏览器会将其留空，除非使用 value 属性指定默认值。

不幸的是，HTML5 没有提供在value 属性（我可以看到）中指定“今天”的方法，只有RFC3339 有效日期，如2011-09-29。

_{来源：Tak's answer on "HTML5 Input Type Date — Default Value to Today?"}

在这种情况下，您可能会编写一个脚本来简单地+1 以查找明天的日期，但您首先必须为您的input id 添加一个默认值以表示今天日期。

至于 anydate？不完全确定你的意思。像日期选择器一样？

这个问题有点不清楚，但我想我会尽可能地帮助提供所提供的信息。

---

要通过 jQuery 分配日期，您总是可以这样做...

http://jsfiddle.net/SinisterSystems/4XkVE/4/

HTML：

<input type="date" id="theDate">

jQuery：

var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!

var yyyy = today.getFullYear();
if(dd<10)dd='0'+dd if(mm<10)mm='0'+mm today = mm+'/'+dd+'/'+yyyy;

$('#theDate').attr('value', today);

alert($('#theDate').attr('value'));

---

编辑：

此外，要同时查找今天和明天的日期，但要确保月末或年末不会影响它，请改用：

http://jsfiddle.net/SinisterSystems/4XkVE/6/

HTML：

<input type="date" id="theDate">
<input type="date" id="tomorrowDate">

jQuery

var today = new Date();
var tomorrow = new Date(new Date().getTime() + 24 * 60 * 60 * 1000);
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var yyyy = today.getFullYear();
var tomday = tomorrow.getDate();
var tommonth = tomorrow.getMonth() + 1;
var tomyear = tomorrow.getFullYear();
if(dd<10)dd='0'+dd if(mm<10)mm='0'+mm today = mm+'/'+dd+'/'+yyyy;
if(tomday<10)tomday='0'+tomday if(tommonth<10)tommonth='0'+tommonth tomorrow = tommonth+'/'+tomday+'/'+tomyear;
$('#theDate').attr('value', today);
$('#tomorrowDate').attr('value', tomorrow);

【讨论】：

谢谢尼古拉斯。明确地：我需要 2 个 id-s 和：#theDate 具有今天的价值，#theTomorrow 具有明天的价值。请告诉我如何在最后同时提醒#theDate 和#theTomorrow。谢谢。

+1 遇到的一个问题是，如果是月底，则无法准确反映。我会更新一个解决方案。两秒。

已更新。让我知道这是否可以解决您的问题，或者您是否可以从那里解决它。

是的，问题是 +1 无法准确反映。事实上，我会在 wordpress contact7 表单上使用#theDate 和#tomorrowDate id-s 在用户开始填写表单之前预先加载2个日期字段。我共享的脚本最初只提供#theDate 无缝运行。但我仍然无法完成这项工作。 :(

对不起。我不知道 wordpress （你没有标记它）。我发现CMS 系统不太可靠。我鼓励您提出一个新问题并标记 wordpress，因为这将针对具有该技能的人。随意将您的新问题链接到这个问题。我只知道我回答了所提出的问题。如果您想标记为已接受（投票箭头旁边的绿色复选框），我将不胜感激。

【参考方案4】：

基于Nicholas Hazel 的响应和user113716 对leading zeroes for dates 的回答，这里有一个简洁的函数来获取格式为YYYY-MM-DD 的日期并设置“日期”类型输入控件的值。

http://jsfiddle.net/wloescher/2t8v7fnf/2/

HTML

<div>Today:
    <input type="date" id="theDate" />
</div>
<div>Tomorrow:
    <input type="date" id="theTomorrow" />
</div>
<div>Any Date:
    <input type="date" id="theAnyDate" />
</div>

JavaScript

// Set values
$("#theDate").val(getFormattedDate(today()));
$("#theTomorrow").val(getFormattedDate(tomorrow()));
$("#theAnyDate").val(getFormattedDate(new Date("4/1/12")));

function today() 
    return new Date();


function tomorrow() 
    return today().getTime() + 24 * 60 * 60 * 1000;


// Get formatted date YYYY-MM-DD
function getFormattedDate(date) 
    return date.getFullYear()
        + "-"
        + ("0" + (date.getMonth() + 1)).slice(-2)
        + "-"
        + ("0" + date.getDate()).slice(-2);

【讨论】：

如果您在多天内打开页面，您的today 和tomorrow 将不正确。将它们定义为函数可能会更好，因此代码改为 today() 或 tomorrow()。

好点 Seph - 我已经修改了代码以包含使用新的 today() 和 tomorrow() 函数