Создание свернутого диапазона от положения пикселя в FF/Webkit

Question

Создание свернутого диапазона от положения пикселя в FF/Webkit

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

Это может быть сделано с объектом TextRange в Интернете Exporer (moveToPoint (x, y) метод).

Как я могу сделать это в FireFox & Webkit?

Я могу получить контейнерный элемент от положения с document.elementFromPoint (x, y). Но когда положение, оказывается, в текстовом узле, как я получаю больше информации о текстовом смещении, требуемом создавать диапазон?

10

javascript range position

задан Yannick Deltroo 6 July 2010 в 20:07

1 ответ

Другие вопросы по тегам:

javascript range position

Похожие вопросы:

score 12 · Answer 1

Вот результат моего исследования для получения позиции символа внутри текстового узла из позиции пикселя:

Стандартизованный способ: получить диапазон из позиции с документом. caretRangeFromPoint (x, y) См. спецификацию на W3c . Это именно то, что я искал. Проблема в том, что Chrome - единственный веб-браузер, реализующий этот метод на момент написания этой статьи (июль 2010 г.)
Способ MS IE с проприетарным textRange.moveToPoint (x, y) .
Способ Firefox: если положение пикселя (x, y) извлекается из события мыши, тогда Firefox добавит два полезных свойства к объекту события: rangParent и rangeOffset
Для Safari и Opera (и фактически это единственный кроссбраузерный метод) состоит в том, чтобы заново составить содержащие блоки для текстовых узлов, а затем использовать положение в пикселях внутри содержащего поля для определения положения символа. Для этого необходимо:
1. Оберните все текстовые узлы в элементы (информация о размерах доступна только для элементов, но не для текстовых узлов)
2. Вызов span.getClientRects () , чтобы получить содержащие блоки для каждого textNode (завернутые в ). Если текстовый узел занимает несколько строк, вы получите несколько полей.
3. Найдите поле, которое содержит вашу позицию в пикселях (x, y), и определите положение символа с помощью простого «правила трех» на основе общей ширины пикселей и длины текста.