如何为我的日期和时间字段进行验证？

Question

有人可以帮我或给我一个关于如何为这两个日期和时间字段进行验证的提示，所以我能够仅以datepicker给我的格式（11/20/2016）和时间的方式保存日期它在下面的值属性中。目前，我可以为日期保存一个空字段（空），为时间保存“时间”，并且我希望能够在单击submit按钮时仅保存给定格式。我一直试图这样做太久，但我根本无法使它工作。 任何帮助将不胜感激。

<div class="form-group"> 
    <label class="control-label col-sm-2" for="date">Date:</label> 
    <div class="col-sm-2" class="dpckr"> 
    <!-- <input class="form-control" id="date" name="date" placeholder="MM/DD/YYY" type="text"/> --> 
    <input id="date" type="text" class="form-control datepicker" name="date" value="Click to select date" required> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="control-label col-sm-2" for="text">Hour:</label> 
    <div class="col-sm-2"> 
    <select class="form-control sct" id="time" name="time"> 
     <option value="">Time</option> 
     <option value="10am">10:00-10:30</option> 
     <option value="1030am">10:30-11:00</option> 
     <option value="11am">11:00-11:30</option> 
     <option value="1130am">11:30-12:00</option> 
    </select> 
    </div> 
</div> 
<button id="saveAppt" type="submit" class="btn btn-default">Submit</button> 

Answer 1

使用正则表达式，可以为数字模式匹配等作为99/99/9999但你可以看到有更多的检查验证的日期时。月份应该在01-12的范围内，在当前月份（闰年）的01-31日之间。

对于这个日期验证问题的一部分，我拉入另一个库，moment.js。您可能可以使用Date.parse() vanilla Javascript，但如果您可以使用它，则Moment功能更强大。

下面我提供了一个validate函数，它执行以下几件事：1）正则表达式匹配日期格式; 2）如果找到匹配项，则用矩量库验证匹配值。如果两个验证都通过，则我记录true否则为false。你可以玩下面的代码片段。

function validate() { 
 
    
 
    // regex pattern to match MM/DD/YYYY 
 
    var pattern = /\d{2}\/\d{2}\/\d{4}/; 
 
    var date = document.getElementById('datepicker').value; 
 
    
 
    // RegExp.test returns explicit true or false if match is found or not 
 
    var isMatch = pattern.test(date); 
 
    
 
    // if a match is found, we still need to validate it as a proper date 
 
    if (isMatch) { 
 
     var strict = true; // require strict match, see moment docs 
 
     var format = 'MM/DD/YYYY'; 
 
     var isValid = moment(date, format, strict).isValid(); 
 
     if (isValid) 
 
      console.log('valid'); 
 
     else 
 
      console.log('not valid'); 
 
    } else { 
 
     console.log('not valid'); 
 
    } 
 
}

<script src="https://momentjs.com/downloads/moment.min.js"></script> 
 
<input id="datepicker" value="01/24/1982"> 
 
<button onclick="validate()">Match</button>