Вернуться к уроку

Список с выделением

важность: 5

Эта задача состоит из трёх частей.

  1. Сделайте список, элементы которого можно выделять кликом.
  2. Добавьте мульти-выделение. Если клик с нажатым Ctrl (Cmd под Mac), то элемент добавляется-удаляется из выделенных.
  3. Добавьте выделение промежутков. Если происходит клик с нажатым Shift, то к выделению добавляется промежуток элементов от предыдущего кликнутого до этого. При этом не важно, какое именно действие делал предыдущий клик. Это похоже на то, как работает файловый менеджер в ряде ОС, но чуть проще, так как конкретная реализация выделений различается у разных ОС, и её точное воспроизведение не входит в эту задачу.

Демо:

P.S. В этой задаче можно считать, что в элементах списка может быть только текст, без вложенных тегов.
P.P.S. Обработка одновременного нажатия Ctrl(Cmd) и Shift может быть любой.

Открыть песочницу для задачи.