javascript - 日期字段的验证

Question

我在表格上有一个日期字段。日期字段中的日期必须晚于今天的日期，而不是过去的日期。它还必须在今天的 30 天内。所以如果今天是 15/01/2013，那么表格只能接受 15/02/2013 之后 30 天内的任何日期，所以 14/04/2007 加上 30 天！

任何人都可以帮助正确的Javascript代码吗？我是个业余爱好者，不知道如何实现这一目标。

Answer 1

我想你需要这样的东西：http: //jsfiddle.net/hqNxW/1/

而且代码...

JavaScript

var output = document.getElementById('messageOutput');
document.getElementById('validate').onclick = function () {
    var value = document.getElementById('date').value;
    if (!validateDate(value)) {
        notify('Invalid date format');
    } else {
        if (!validateDateRange(value)) {
            notify('The date should be after today but not more than 29 days!');
        } else {
            notify('Valid date');
        }
    }
}

function notify(msg) {
    output.innerHTML = msg;
}

function validateDate(date) {
    return (/^\d{2}-\d{2}-\d{4}$/).test(date);
}

function validateDateRange(inputDate) {
    var now = new Date(),
        after30Days = new Date().setDate(now.getDate() + 30)
        date = new Date(inputDate);
    return date > now && date < after30Days;
}

HTML

<input type="text" id="date" /> <button id="validate">Validate</button>
<div id="messageOutput">Enter a date in the following format: mm-dd-yyyy</div>

Answer 2

您的验证功能应该是这样的：

function validateDateField()
{
  var result=true;        // optimistic....

  var now=new Date();
  var thisMonth=now.getMonth();
  var maxDate=new Date();
  maxDate.setMonth(thisMonth+1);

  //---------getting the user input:
  var dateStr=document.getElementById('dateField').value;

  //change "dd/mm/yyyy" format to "yyyy/mm/dd" format:
  dateStr = dateStr.replace(" ","");
  dateStr = dateStr.substr(6,4)+"/"+dateStr.substr(3,2)+"/"+dateStr.substr(0,2);

  //---------validation part:
   document.getElementById('feadBackLable').innerHTML="";
  try
  {
    var userDate=new Date(Date.parse(dateStr));
    if(userDate < now || userDate > maxDate)  
     {
           result=false;
           document.getElementById('feedBackLable').innerHTML="your date should be one of the next 30 days";
     }
  }
  catch(err)
  {
     result=false;
     document.getElementById('feadBackLable').innerHTML="please enter a valid date: dd/mm/yyyy";
  }
  //---------------------------
  return result;

} // function