2012-01-22 1 views
5

Я ищу способ вычисления начального и конечного положения выбора пользователей из известного родительского элемента. Я наткнулся на this с некоторыми небольшими изменениями. Мне удалось работать с FF, но я не уверен, как это сделать в IE, и я хотел бы получить некоторые мысли, если моя модификация подходит. Большое спасибо Тиму Дауну за оригинальный ответ.Рассчитать начальную и конечную позицию выбора пользователя с помощью javascript из родительского элемента

function getBodyTextOffset(node, offset) { 
    var sel = window.getSelection(); 
    var range = document.createRange(); 
    range.selectNodeContents(document.getElementById('test')); 
    range.setEnd(node, offset); 
    sel.removeAllRanges(); 
    sel.addRange(range); 
    return sel.toString().length; 
} 

function getSelectionOffsets() { 
    var sel, range; 
    var start = 0, end = 0; 
    if (window.getSelection) { 
     sel = window.getSelection(); 
     if (sel.rangeCount) { 
      range = sel.getRangeAt(sel.rangeCount - 1); 
      start = getBodyTextOffset(range.startContainer, range.startOffset); 
      end = getBodyTextOffset(range.endContainer, range.endOffset); 
      sel.removeAllRanges(); 
      sel.addRange(range); 
      alert(start + ", " + end); 
     } 
    } else if (document.selection) { 
     // IE stuff here 
    } 
    return { 
     start: start, 
     end: end 
    }; 
} 

Я знаю, что это было время, но вот JSFiddle показывает идею. Опять же, он работает в FF и Chrome, но не в IE9. В идеале я хотел бы получить смещение от начала теста элемента.

+1

reduced [jsfiddle] (http://jsfiddle.net/) демо значительно улучшит ваши шансы получить хороший ответ. – c69

+0

Посмотрите на [Rangy] (http://code.google.com/p/rangy/). Возможно, вы сможете довольно точно перевести свой текущий код. – Hemlock

ответ

1

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

Вот некоторые демки, которые можно использовать в качестве ссылки ...

http://dylanschiemann.com/articles/dom2Range/dom2RangeExamples.html

смутное, хотя приличного старта чтобы понять, какие методы и свойства доступны ... http://help.dottoro.com/ljxsqnoi.php

Вы можете узнать, что содержит то, что использует следующий JavaScript ...

for (i in window.getSelection()) {alert('i = '+i);} 

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

for (i in window.getSelection().getRangeAt(0)) {alert('i = '+i);} 

Также в браузерах Gecko есть ОЧЕНЬ неприятная ошибка диапазона (например, Firefox), если вы перемещаете мышь только немного вне элемента, хотя менее 50% буквы/символа, который Gecko неправильно устанавливает граничный элемент в этот элемент, даже если он не был выбран. Исключительно противно просто пытаться выяснить, что это такое, и Mozilla фактически отказалась его исправлять (поскольку у них есть множество других ошибок, где они явно не так), вот ссылка на сообщение об ошибке, которое я сделал ...

https://bugzilla.mozilla.org/show_bug.cgi?id=696571

Надеюсь, это поможет вам двигаться в правильном направлении.

Смежные вопросы