Сохранить / восстановить выделение на contentEditable ПОСЛЕ изменения внутреннегоHTML

Question

Я знаю, что получить / установить позицию курсора в contentEditable чертовски практически невозможно.Мне не важно знать эту информацию.Мне нужно иметь возможность сохранить текущее выделение, изменить innerHTML элемента div, а затем восстановить выделение.

Я экспериментирую с ответом, предоставленным в contenteditable выбранный текст, сохранить и восстановить ,Это работает после ввода в div, но не после программно изменения innerHTML div.Вместо этого, когда я вызываю restoreSelection, каретка просто переходит в начало.

Любые предложения относительно того, как можно сохранить / восстановить выделение в contentEditable после изменения innerHTML вместо ввода, будут очень благодарны.

Answer 1

Если вы выполняете какое-то подстановку строк в существующем innerHTML вашего редактируемого элемента, вы можете использовать мою библиотеку Rangy и ее выбор сохранения / восстановления модуль.Он использует невидимые элементы с определенными идентификаторами, чтобы отметить начальную и конечную границы выделения, поэтому, если ваше innerHTML изменение не включает эти элементы, это не будет работать.

Другая альтернатива - делать это исключительно на основена индексы символов в текстовых узлах элемента.Я написал наивную реализацию здесь: https://stackoverflow.com/q/5596688/96100