2015-08-20 5 views
1

Я с contenteditable <p> элемента, который содержит текст, внутри этого элемента <p> есть один встроенный элемент, который является <span> contenteditable не позволит мне писать по индексу 0 в <span>Записи с индексом 0 в contenteditable строкового элемента

Я сделал скрипку для демонстрации проблемы: JsFiddle

Теперь откройте консоль браузеров, а затем попытаться напечатать что-нибудь с индексом 0 в инлайн <span>. Поскольку вы можете видеть, что ввод текста не будет помещен в индекс 0, а вместо этого в последний индекс первого текстового узла.

Я пытался изменить это поведение с помощью rangy.js.
Идея состояла в том, чтобы проверить, помещен ли каррель, который был помещен последним индексом в первом текстовом узле, а затем нажата стрелка вправо, я поместил бы carret на индекс 0 во втором узле. Но проблема продолжалась.

 //rangy try without the if-statement.  
     var nodes = $el[1].childNodes, index = 0; 
     var range = rangy.createRange(); 
     //Setting the start at node 2 index 0. 
     range.setStart(nodes[1], index); 
     range.collapse(true); 
     var sel = rangy.getSelection(); 
     sel.setSingleRange(range); 

ответ

2

Это специфическое поведение реализации (браузера).

Rerence: http://www.w3.org/community/editing/wiki/ContentEditable#Collapsed_selections_.28carets.29

  • Учитывая дом с несколькими позициями Dóm для тех же самых заметных позициях, UA в настоящее время варьируются, в котором позиция считается печатаемые позиции. Пример: данный foo<b>bar</b>baz

    • С курсором между Foo и бар, вставки бывает:

      • IE: Нажмите, вне B. Стрелки, внутри.
      • FF: Нажмите, снаружи. Стрелка внутри тега внутри. Стрелка снаружи тега снаружи.
      • Хром: Всегда вне.

Как вы можете видеть, что поведение отличается в разных браузерах. Хотя в IE и FF вы можете щелкнуть внутри своего span и использовать клавишу со стрелкой для перехода в первую позицию, Chrome всегда будет помещать курсор за пределы вашего span. Кроме того, с помощью FF вы можете перемещаться только с помощью клавиши со стрелкой изнутри span, если перемещение извне курсора должно оставаться снаружи.

+0

Спасибо. Хорошо, я понимаю проблему. Вопрос в том, есть ли способ обхода браузера по умолчанию. –

+0

@JonathanAndersson: Нет, потому что нет возможности рассказать о намерениях пользователя, действительно ли они хотели вставить символ в начале тега или в конец предыдущего текстового узла. – Abhitalks