range.setStartBefore и range.setEndAfter не работают в Edge и IE11 в contenteditable - PullRequest
0 голосов
/ 01 июня 2018

Хотя ошибок нет, и Edge и IE11 поддерживают range.setStartBefore и range.setEndAfter , ничего не происходит.Я проверил каждое свойство, и все выглядит правильно, но выделения / выделения полного диапазона не происходит.

Это правильно работает в Chrome, Firefox и Opera.

Для взаимодействия выберитепара символов или слов в середине текста lorem ipsum.Chrome, Firefox и Opera выберут остальную часть текста lorem ipsum, как они и должны.Edge и IE11 ничего не делают.

Демонстрация: https://codepen.io/anon/pen/OEVzoe

document.querySelector('div').addEventListener('mouseup', function() {
  var range = window.getSelection().getRangeAt(0);
  range.setStartBefore(range.startContainer.parentNode);
  range.setEndAfter(range.endContainer.parentNode);
});
<div contenteditable="true">
  <p>Hi</p>
  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum aspernatur veniam ut accusamus, ratione nemo veritatis itaque, quia esse in recusandae qui pariatur tenetur non optio odio quis fugiat minima.</p>
  <p>Bye</p>
</div>

1 Ответ

0 голосов
/ 01 июня 2018

Хотя Edge и IE11 не визуально показывают это, диапазон все еще выбирается.Вы можете увидеть это, добавив range.deleteContents(); в качестве последней строки в обратном вызове функции.

Однако , это означает, что любое поведение редактирования, например редактирование форматированного текста для изменения стиля, будет использовать ТОЛЬКО то, чтовизуально выбран / выделен, даже если фактический диапазон отличается!: /

...