Firefox contentEditable проблемы фокусировки - PullRequest
Новая
       11

Firefox contentEditable проблемы фокусировки

6 голосов
/ 01 августа 2010

Я использую теги contentEditable div на своем веб-сайте, и я заметил странную проблему при использовании Firefox.

Вот пример исходного кода: 

<html>
  <head>
  </head>
  <body>
    <div contentEditable="true" style="margin-left:auto; 
         margin-right:auto; height:200px; width:200px; border-style:solid; 
         border-color:black; border-width:1px;"></div>
  </body>
</html>

Вот шаги для воспроизведения.

  1. contentEditable имеет фокус и курсор мигает внутри div, но в div нет текста
  2. пользователь нажимает на contentEditable ДИВ
  3. div по-прежнему показывает фокус, но есть теперь нет мигающего курсора, а пользователь не может вводить данные в div

Я воспроизвел эту ошибку с Firefox 3.6.3 в Ubuntu и Firefox 3.5 в Windows XP. Это не происходит с Chrome.

Есть идеи о том, почему это происходит и что делать, чтобы это исправить?

РЕДАКТИРОВАТЬ: Одним из возможных решений может быть ручная установка, где находится курсор. Кто-нибудь знает как это сделать? Я искал в Интернете, но, похоже, W3 не поддерживает ничего.

Спасибо!

Ответы [ 3 ]

3 голосов
/ 04 октября 2010

Я исправил это с помощью UTF "Zero-width space".В PHP это следующие двойные кавычки:

"\ xE2 \ x80 \ x8B"

Затем вы можете избежать этого, используя: trim ($ string, "\ xE2 \ x80 \ x8B ")

Когда этот невидимый символ предварительно загружен в редактируемый div, эта ошибка исчезнет.

Я использую кодировку UTF-8 для своей страницы, а также исходного файла (и база данных ... все)

2 голосов
/ 14 февраля 2011

Просто добавьте &nbsp; в <div>.

1 голос
/ 11 августа 2010

Со мной тоже случилось, иногда работает, иногда нет. определенно ошибка, я бы сказал. Вы можете попробовать вставить скрытый символ, он начинает мигать, как только появляется текст.

...