JSFiddle - React, Tailwind, and code Playground
HTML
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check1" class="chkbox" name="months[]" value="Январь"><span>Январь</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check2" class="chkbox" name="months[]" value="Февраль"><span>Февраль</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check3" class="chkbox" name="months[]" value="Март"><span>Март</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check4" class="chkbox" name="months[]" value="Апрель"><span>Апрель</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check5" class="chkbox" name="months[]" value="Май"><span>Май</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check6" class="chkbox" name="months[]" value="Июнь"><span>Июнь</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check7" class="chkbox" name="months[]" value="Июль"><span>Июль</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check8" class="chkbox" name="months[]" value="Август"><span>Август</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check9" class="chkbox" name="months[]" value="Сентябрь"><span>Сентябрь</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check10" class="chkbox" name="months[]" value="Октябрь"><span>Октябрь</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check11" class="chkbox" name="months[]" value="Ноябрь"><span>Ноябрь</span></label></div>
<div class="col-lg-4 check-btn"><label><input type="checkbox" id="check12" class="chkbox" name="months[]" value="Декабрь"><span>Декабрь</span></label></div>
JavaScript
$.fn.shiftClick = function () {
var lastSelected; // Firefox error: LastSelected is undefined
var checkBoxes = $(this);
this.each(function () {
$(this).click(function (ev) {
if (!lastSelected ) {
lastSelected = this;
} else {
var last = checkBoxes.index(lastSelected);
var first = checkBoxes.index(this);
var start = Math.min(first, last);
var end = Math.max(first, last);
var chk = lastSelected.checked;
for (var i = start; i <= end; i++) {
checkBoxes[i].checked = chk;
}
}
})
});
};
$('.chkbox').shiftClick();