JS检查有效日期格式

Question

我有一个文本字段，用户以以下格式输入日期-时间: dd/mm/YYYY hh:ii。我想使用JavaScript检查这是否是有效的日期时间，其中应包括2月29日和所有其他特殊月份。我该如何做？正则表达式无法成功处理特殊月份。

- user1544337

---

如果您使用JQuery，请参见：http://jqueryui.com/datepicker/ - QuentinUK

@RachelGallen请将此作为答案提交。QuentinUK：很好，但不是我要求的。 - user1544337

@CamilStaps，我恐怕想不起来了，而且我现在有点忙。你可以试着谷歌一下吗？也许在其他地方的堆栈上有相关信息？ - Rachel Gallen

@ynos1234 是的，当然感谢你。 - user1544337

@CamilStaps 谢谢！！！ - Rachel Gallen

Answer 1

请参阅http://internotredici.com/article/checkdateinjavascript/，这是一篇有关检查时间的有用文章 - 正好符合您的需求！下面是完整文章内容。程序员经常需要验证插入表单的信息并检查其正确性，利用javascript很有用。本教程将介绍如何使用javascript验证日期是否有效。表单中的日期有两种不同的插入方式，第一种使用文本字段，用户按不同的模式输入数据（在本教程中，我们假设日期以dd-mm-yyyy格式）; 第二个使用下拉菜单。第一种解决方案更简单易行，但更容易出现用户错误（例如插入无效字符或更频繁地键入格式不同于计划格式的日期）。现在假设我们在以下文本字段中想要以dd-mm-yyyy格式插入日期：

<form id="test_form" action="get" method="/checkdatejavascript" 
onsubmit="return(check_form(this)); return false;">
<input type="text" name="datefield" id="datefield" />
</form>

为了检查插入数据的正确性，我们将使用check_form函数：

function check_form()
{
// Regular expression used to check if date is in correct format
var pattern = new RegExp([0-3][0-9]-(0|1)[0-9]-(19|20)[0-9]{2});
if(document.getElementById('datefield').value.match(pattern))
{
  var date_array = document.getElementById('datefield')
                   .value.split('-');
  var day = date_array[0];

  // Attention! Javascript consider months in the range 0 - 11
  var month = date_array[1] - 1;
  var year = date_array[2];

  // This instruction will create a date object
  source_date = new Date(year,month,day);

  if(year != source_date.getFullYear())
  {
     alert('Year is not valid!');
     return false;
  }

  if(month != source_date.getMonth())
  {
     alert('Month is not valid!');
     return false;
  }

  if(day != source_date.getDate())
  {
     alert('Day is not valid!');
     return false;
  }
}
else
{
  alert('Date format is not valid!');
  return false;
}

return true;

正如我们所看到的，蓝色标记的正则表达式用于控制插入日期是否遵循默认分配的格式。如果模式有效，则函数将继续下一步，否则会引发错误消息并且表单不会被发送（正则表达式还保证日期不能为空）。 为了验证日期，我们将使用javascript提供的Date对象。（请检查红色标记的代码）。算法非常简单。使用用户插入的信息，我们将创建一个Date对象，并使用getFullYear，getMonth和getDate方法产生三个值，分别表示与之相关联的年份、月份和日期。如果这些值等于用户插入的值，则日期是正确的。现在考虑以下示例：

用户在文本字段中插入字符串09-01-1976 从字符串创建的日期对象为09-01-1976 日期有效

用户在文本字段中插入字符串31-02-2006 从字符串创建的日期对象为03-03-2006 日期无效

程序员必须特别注意（请检查绿色标记的代码）javascript处理日期的方式，因为月份被认为是从0到11的范围，假设0是1月，11是12月。 如果使用下拉菜单插入日期，则控件更简单，因为不需要正则表达式来验证日期格式：

  <form id="test_form" action="get" method="/checkdatejavascript" 
   onsubmit="return(check_form(this)); return false;">
  <select name="dateday" id="dateday">
  <option value="1">1</option>
     […]
  </select>
  <select name="datemonth" id="datemonth">
  <option value="0">January</option>
     […]
   </select>
   <select name="dateyear" id="dateyear">
  <option value="2006">2006</option>
     […]
  </select>
  </form>

控制日期正确性的JavaScript函数为：

 function check_form()
{
 var day = document.getElementById('dateday').value;
 var month = document.getElementById('datemonth').value;
 var year = document.getElementById('dateyear').value;

 // This instruction will create a date object
 source_date = new Date(year,month,day);

 if(year != source_date.getFullYear())
{
   alert('Year is not valid!');
   return false;
}

if(month != source_date.getMonth())
{
  alert('Month is not valid!');
  return false;
}

if(day != source_date.getDate())
{
  alert('Day is not valid!');
  return false;
}

 return true;
}

更新：我已经更新了代码，因为正则表达式出现了问题。感谢Alex的建议。

- Rachel Gallen

---

如果链接失效，这个答案就毫无用处了。 - Evan Davis

Answer 2

如果使用moment.js是可以的，您可以查看日期时间解析工具 http://momentjs.com/docs/#/parsing/string-format/。例如：

moment("29/02/2014 11:45", "DD/MM/YYYY hh:mm", true).isValid()

- JYing

Answer 3

如果您不想使用其他外部库，可以使用以下函数：

var validateDate = function(dateTime){
  var f_date = dateTime.split(" ")[0].split("/").reverse().join("/");
  var time = dateTime.split(" ")[1];

  var date = dateTime.split(" ")[0].split("/").map(function(c, i, a){
        return parseInt(c);
    });
  var daysInMonth = [31,28,31,30,31,30,31,31,30,31,30,31];
  if ( (!(date[2] % 4) && date[2] % 100) || !(date[2] % 400)) {
    console.log("inside");
    daysInMonth[1] = 29;
  }

  if(date[0] > 0 && (date[0] <= daysInMonth[(date[1]-1)]) && date[1] > 0 && date[1] <= 12){
    return new Date(f_date + " " + time) != "Invalid Date";
  }
  return false;
}

这将解决闰年变化的问题。只有在输入格式为dd/mm/YYYY hh:ii时，此功能才能正常工作。 你可以尝试一些类似这样的示例输入：

validateDate("29/2/2000 12:30"); // Should return true
validateDate("29/2/2001 12:30"); // Should return false
validateDate("32/8/2000 12:30"); // Should return false
validateDate("30/11/2000 12:30"); // Should return true
validateDate("31/4/2000 12:30"); // Should return false
validateDate("15/7/2000 12:77"); // Should return false

- Sony Mathew