按住 Shift 键点击多个元素时如何正确记录选中状态？

长孙米娅提问于 2026-03-03 10:41:22 阅读 76

交互

我在做一个类似文件管理器的多选功能，想实现按住 Shift 键后点击两个项目，自动选中它们之间的所有项。但目前的问题是，每次点击都会触发默认的单选逻辑，导致中间的元素没法正确选中。

我试过在 click 事件里判断 event.shiftKey，但不知道怎么获取上次点击的元素索引。而且如果用户先 Ctrl+Click 选了几个不连续的，再用 Shift 点击，逻辑就更乱了……有没有比较通用的处理方式？

document.querySelectorAll('.item').forEach((item, index) => {
  item.addEventListener('click', (e) => {
    if (e.shiftKey) {
      // 这里卡住了：怎么知道上一次点击的是哪个？
      // 想选中 fromIndex 到 currentIndex 之间的所有元素
    } else {
      // 正常单选或 Ctrl 多选逻辑
    }
  });
});

Shift 键盘交互

我来解答赞 1 收藏

反馈

暂无解答