Есть ли способ сделать не редактируемый диапазон?

Question

Я использую редактируемый контент div как редактор для совместной работы в режиме реального времени. Мне нужно рисовать курсоры/курсоры для каждого пользователя на стороне клиента. Я делаю это, добавляя и удаляя промежуток для каждого события, например нажатия клавиши и нажатия.

<span id="caret1" style="fontSize:18px color:red">|</span> 

Как я могу сделать этот диапазон незаменимым? Таким образом, когда пользователь оставляет свою каретку в постоянной позиции, а другой пользователь редактирует что-то в этой же позиции, он не может удалить эту каретку за счет резервного копирования или выбрать ее и отредактировать, как если бы это был текст.

EDIT:

<span id="caret1" style="fontSize:18px color:red" contenteditable=false>|</span> 

не позволяет пользователям писать в пролете, по крайней мере, но пользователи все еще в состоянии удалить этот промежуток на забой.

Answer 1

Пара вещей

1) Ваш исходный код не отформатирован правильно. Слишком много двойных кавычек.

"fontSize:18px" color:red" 

2) Другое дело, я не видел contentEditable как истинный стиль, я видел в действии работает больше как pseudoclass (на который ссылается в CSS-файлы) или атрибут HTML-теги, а не как сам стиль.

<span id="caret1" contentEditable="true" style=""> 

3) Если ни одна из этих работ, можно попробовать JavaScript/JQuery подход, при котором удаление или реверс до точки, где бы два курсора друг на друга. вы можете добавить оба идентификатора к одному и тому же диапазону.

`<span id="caret1 caret2" style="fontSize:18px" contenteditable:"false" color:"red">|</span> ` 

и когда caret2 делает что-то другое, выйти из caret1, и создать новый для caret2 ...

Чтобы сделать это, вы могли бы использовать немного сценариев (и, возможно, использовать что-то вроде rangyInputs) , и определить, имеет ли выделенный текст в нем еще одну каретку ... а также использовать бит этого .on ('keypress') для проверки на удаление/backspace ...