Javascript 使用shift键选择多个div

我正在尝试使用shift键选中所有复选框，如Gmail

shift+鼠标单击

。一个接一个正在工作，它是一个

div

。但当我添加

shift键

code时，它不起作用

---

更改：

差不多完成了。当我先单击，然后按shift键，然后单击第5次时，所有已选中，但当我单击第3次时，则出现问题。！直到5号到3号才检查

let hold=false；
让索引={start:null，end:null}；
让start=false；
document.onkeydown=函数（e）{
如果（e.keyCode==16）{
保持=正确；
}
}
document.onkeyup=函数（e）{
如果（e.keyCode==16）{
保持=假；
}
}
$（文档）.on（'单击'，'.dropCheckBox'，函数（）{
$（this.parents（“.capturesGrid”）.toggleClass（'selected'）；
$（this.toggleClass（'active'）；
如果（$（“.grid view.selected”）.length>0）
{
$（this）.parents（“.grid view”）.addClass（'checking'）；
$（“.options bar”）.addClass（'allSection'）；
$（“.iconActions”）.removeClass（'d-none'）；
$（“.allsec det”）.addClass（'allSection-det'）；
}
其他的
{
$（this）.parents（“.grid view”）.removeClass（'checking'）；
$（“.options bar”）.removeClass（'allSection'）；
$（“.iconActions”）.addClass（'d-none'）；
$（“.allsec-det”）.removeClass（'allSection-det'）；
}
如果（举行）{
index.end=$（this.data（'index'）；
if（index.start）{
console.log（索引）；
if（index.endindex.end）{
如果（！item.hasClass（'active'））{
item.addClass（“活动”）；
$（this）.parents（“.grid view”）.addClass（'checking'）；
$（this.parents（“.capturesGrid”）.toggleClass（'selected'）；
}
}
}否则{
if（item.data（'index'）&&item.data（'index'）index.end）{
if（item.hasClass（'active'））{
item.removeClass（“活动”）；
$（this）.parents（“.grid view”）.removeClass（'checking'）；
$（this.parents（“.capturesGrid”）.toggleClass（'selected'）；
}
}
}
});
}
}否则{
$（'.dropCheckBox'）。每个（函数（索引，项）{
项目=$（项目）；
if（！$（this）.hasClass（'active'））{
if（item.data（'index'）&&item.data（'index'）
.dropCheckBox{
位置：静态；
不透明度：1；
显示器：flex；
证明内容：中心；
对齐项目：居中；
宽度：22px；
高度：22px；
边界半径：4px；
背景：rgba（0,0,0,0.7）；
光标：指针；
边框：2倍实心#fff；
过渡：所有。2轻松；
}
.dropCheckBox.active{
背景：线性梯度（0度，#214fc6，#4574ec）；
边界：无；
}
.capturesGrid.dropCheckBox{
位置：绝对位置；
顶部：10px；
左：10px；
不透明度：1；
z指数：2；
}
.dropCheckBox.icon{
宽度：13px；
高度：13px；
填充：#dee3eb；
}
您可以使用
复选框
，您可以找到不同的答案


$（文档）.ready（函数（）{
var$chkboxes=$（'.dropCheckBox'）；
var lastChecked=null；
$chkboxes.单击（函数（e）{
$（this.parents（“.capturesGrid”）.toggleClass（'selected'）；
$（this.toggleClass（'active'）；
如果（！lastChecked）{
lastChecked=这个；
返回；
}
如果（如换档键）{
$（this.removeClass（'active'）；
var start=$chkboxes.index（此）；
var end=$chkboxes.index（最后选中）；
$chkboxes.slice（Math.min（start，end）+1，Math.max（start，end）+1）；
}
lastChecked=这个；
});
});
.dropCheckBox{
位置：静态；
不透明度：1；
显示器：flex；
证明内容：中心；
对齐项目：居中；
宽度：22px；
高度：22px；
边界半径：4px；
背景：rgba（0,0,0,0.7）；
光标：指针；
边框：2倍实心#fff；
过渡：所有。2轻松；
}
.dropCheckBox.active{
背景：线性梯度（0度，#214fc6，#4574ec）；
边界：无；
}
.capturesGrid.dropCheckBox{
位置：绝对位置；
顶部：10px；
左：10px；
不透明度：1；
z指数：2；
}
.dropCheckBox.icon{
宽度：13px；
高度：13px；
填充：#dee3eb；
}