javascript - 选定日期复选框的短日期范围

Question

我们有一组被标识为日期复选框的复选框。这些被称为入住日期。退房日期比入住日期晚 1 天。例如，如果入住日期为 24/09/2017，则结账日期为 25/09/2017。

因此，如果选择连续日期，我们将尝试获得较短的日期范围，例如，如果我们有四个日期 24/09/2017、25/09/2017、26/09/2017、27/09/2017。如果我们选择 24/09/2017，则入住日期为 24/09/2017，退房日期为 25/09/2017。但是如果我们选择 24 和 25,26 那么在数组中我们有三个值

checkindat:"24/09/2017",checkouts:"25/09/2017"

和

checkindat:"25/09/2017",checkouts:"26/09/2017"

和

checkindat:"26/09/2017",checkouts:"27/09/2017"

所以我们希望如果日期范围按顺序排列，那么它会显示入住日期为 24/0/2017，退房日期为 27/09/2017。但是，如果我们取消选中日期，那么它现在就可以正常工作了。

这是我在这个 jsfiddle 中的部分代码

var alreadycheckin = [];

$("input[class='check htcheck']:checkbox").change(function() {
  var roomids = $(this).attr("roomid");
  checkindat = $(this).attr("name");
  var new_dates = moment(checkindat, "DD.MM.YYYY");
  var checkid = new_dates.format('DD-MM-YYYY');
  //if ($(this).is(":checked")) 
  {
    var html = '';
    arr = [];
    var roomcods = $(this).attr("value");
    var roomids = $(this).attr("roomid");
    checkindat = $(this).attr("name");
    var new_dates = moment(checkindat, "DD.MM.YYYY");

    var checkid = new_dates.format('DD-MM-YYYY');
    //console.log(checkid);
    var checkouts = new_dates.add(1, 'days').format('DD/MM/YYYY');
    var roomcodes = $(this).attr("value");
    var uniq = roomids + '_' + name + '_' + checkindat;
    uniq = uniq.split("/").join("").split("_").join("");
    var uniqs = '';
    //console.log($("#aa"+roomids));
    //	alreadycheckin.push({ roomids : roomids, checkindat : checkindat, checkouts: checkouts });
    var arrElement = {
      roomids: roomids,
      checkindat: checkindat,
      checkouts: checkouts
    };
    if ($(this).is(":checked")) {
      //alreadycheckin[uniq]={ roomids : roomids, checkindat : checkindat, checkouts: checkouts };
      alreadycheckin.push(arrElement);
    } else {
      var index1 = arr.indexOf(arrElement);
      alreadycheckin.splice(index1, 1);
    }

    var tmpAlreadycheckin = [];
    // tmpAlreadycheckin=alreadycheckin.slice(0);
    for (var i = 0; i < alreadycheckin.length; i++) {
      if (i > 0) {
        if (typeof alreadycheckin[i - 1] != "undefined" || alreadycheckin[i - 1] != null) {
          if (alreadycheckin[i].checkouts == alreadycheckin[i - 1].checkindat) {
            console.log("111");
            var arrElement1 = {
              roomids: roomids,
              checkindat: alreadycheckin[i].checkindat,
              checkouts: alreadycheckin[i - 1].checkouts
            };
            tmpAlreadycheckin.push(arrElement1);
            //tmpAlreadycheckin[i].checkouts =tmpAlreadycheckin[i+1].checkouts;
            //tmpAlreadycheckin.splice(i+1, 1);
          } else {
            console.log("2222");
            var arrElement2 = {
              roomids: roomids,
              checkindat: alreadycheckin[i].checkindat,
              checkouts: alreadycheckin[i].checkouts
            };
            tmpAlreadycheckin.push(arrElement2);
          }
        } else {
          console.log("3333");
          var arrElement2 = {
            roomids: roomids,
            checkindat: alreadycheckin[i].checkindat,
            checkouts: alreadycheckin[i].checkouts
          };
          tmpAlreadycheckin.push(arrElement2);
        }
      } else {
        console.log("3333");
        var arrElement2 = {
          roomids: roomids,
          checkindat: alreadycheckin[i].checkindat,
          checkouts: alreadycheckin[i].checkouts
        };
        tmpAlreadycheckin.push(arrElement2);
      }


    }
    console.log(tmpAlreadycheckin);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>

<input roomid="15" id="15_24/09/2017" class="check htcheck" name="24/09/2017" value="1" type="checkbox">24/09/2017 <br/>
<input roomid="15" id="15_25/09/2017" class="check htcheck" name="25/09/2017" value="1" type="checkbox">25/09/2017 <br/>
<input roomid="15" id="15_26/09/2017" class="check htcheck" name="26/09/2017" value="1" type="checkbox">26/09/2017 <br/>
<input roomid="15" id="15_27/09/2017" class="check htcheck" name="27/09/2017" value="1" type="checkbox">27/09/2017 <br/>

Answer 1

如果你有一个这样格式的对象数组:[{checkindat:"24/09/2017",checkouts:"25/09/2017"},{checkindat:"25/09/2017",checkouts:"26/09/2017"}] :那么您可以先通过 checkindate 对数组进行排序，然后向后遍历数组。您将从最后一个元素开始，查看其 checkindat，然后将其与前一个元素的 checkouts 进行比较。如果它们相同，则将前面的元素 checkouts 更新为它前面的元素，然后删除它前面的元素。