javascript - Foundation 5 遵守 js 检查日期是否早于另一个日期

Question

我正在使用 zurb foundation 5 和 abide js 检查我的表单。我必须检查 DATE1 是否早于或等于 DATE2

如何使用 abidejs 检查它是否有效？

Answer 1

简短的回答是你不能真的为此使用遵守。 Abide 不利于您需要对日期进行比较以检查一个日期是否大于或等于另一个日期。一些自定义 javascript 可以为您做到这一点，但您会发现 abide 会与您争夺对错误消息的控制权，这意味着您将完全放弃 abide 并自行处理所有错误。

这是我的意思的一个例子:

HTML

<div class="panel">
  <form data-abide class="date-form">
    <div class="date-1">
      <label>Date 1</label>
      <input type="date">
      <small class="error">This is not a valid date.</small>
    </div>
    <div class="date-2">
      <label>Date 2</label>
      <input type="date">
      <small class="error">Date 2 must be a valid date and fall on or after date 1.</small>
    </div>
    <button type="submit">Submit</button>
  </form>
</div>

Javascript

//lets do a check when one of the input values has changed
$('.date-form').on('change', '.date-1 input, .date-2 input', function() {
  //lets convert our dates to values we can do a comparison with
  date1 = Date.parse($('.date-1 input').val());
  date2 = Date.parse($('.date-2 input').val());

  //lets check that both values are valid numbers
  if ($.isNumeric(date1) && $.isNumeric(date2)) {
    //lets check if date 2 is not greater or equal to date one and throw an error
    if (date1 > date2) {
      //we have a problem add error class to date-2 for error message
      $('.date-2').addClass('error');
    }
  }
});

这将与 abide 作斗争。这是一个 fiddle 来说明它 http://codepen.io/anon/pen/fiKFc .

这么长的答案仍然是你不能真正为此使用遵守。对不起。