JavaScript Selection.isCollapsed — чи виділення порожнє

Властивість isCollapsed каже, що виділення порожнє — тобто це просто курсор, а не виділений текст.

правити

Загальний опис

Це найважливіша перевірка в усій роботі з виділенням. Без неї кнопка «жирний» спрацює на порожнечі, панель форматування виринатиме на кожен клік, а getRangeAt(0) кине помилку.

Правило просте: перше, що робить будь-який обробник виділення — питає isCollapsed.

правити

+ додати пораду чи нотатку

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
isCollapsed	1+	1+	1+	7+	12+	9+

Підтримка: мобільні переглядачі

Переглядач
isCollapsed	yes	yes	yes	yes

Приклади

+ запропонувати свій приклад у пісочниці

document.addEventListener('selectionchange', () => {
    const selection = window.getSelection();

    // просто клік, а не виділення — виходимо
    if (selection.isCollapsed) {
        panel.hidden = true;
        return;
    }

    showPanel(selection.getRangeAt(0));
});