jQuery验证 - 比较同一个类

时间:2016-01-21 08:42:43

标签: javascript jquery jquery-validate

我有x个具有相同类名的文本框。我希望用户在其中输入日期,每个日期应该大于前一个日期。我怎样才能做到这一点?

jQuery -

jQuery.validator.addMethod("greaterrule", function(value, element, param) {
   return $(param).not(element).get().every(function(item) {
     return $(item).val() < value;
 });
}, "Please specify a greater value");


jQuery.validator.addClassRules("dept_date", {
  greaterrule: ".dept_date"
});

HTML -

First Date <input type="text" name="first_date" class="dept_date"> <br>
Second Date <input type="text" name="second_date" class="dept_date"> <br>
Third Date <input type="text" name="third_date" class="dept_date"> <br>
Fourth Date <input type="text" name="fourth_date" class="dept_date"> <br>

1 个答案:

答案 0 :(得分:1)

尝试使用prevAll检查之前的所有日期并使用Date进行比较: -

&#13;
&#13;
jQuery.validator.addMethod("greaterrule", function(value, element, param) {

  return $(element).prevAll(param).get().every(function(prev) {
      return new Date($(prev).val()) < new Date($(element).val());
  });

}, "Please specify a greater value");


jQuery.validator.addClassRules("dept_date", {
  greaterrule: ".dept_date"
});

$("form").validate();
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/jquery.validate.min.js"></script>

<form method="post">
  First Date
  <input type="text" value="01/21/2016" name="first_date" class="dept_date">
  <br>Second Date
  <input type="text" value="01/22/2016" name="second_date" class="dept_date">
  <br>Third Date
  <input type="text" value="01/23/2016" name="third_date" class="dept_date">
  <br>Fourth Date
  <input type="text" value="01/24/2016" name="fourth_date" class="dept_date">
  <br>
  <input type="submit" value="submit" />
</form>
&#13;
&#13;
&#13;