Выбор диапазона и Mozilla

Я хотел бы указать, что firefox выбирает диапазон. Я могу сделать это легко с IE, используя range.select() ;. Похоже, что FFX ожидает элемент dom. Я ошибаюсь, или есть лучший способ сделать это?Выбор диапазона и Mozilla

Я начинаю с выбора текста, преобразуя его в диапазон (я думаю?) И сохраняя выбор текста. Здесь я получаю диапазон от первоначально:

// Before modifying selection, save it 
    var userSelection,selectedText = ''; 
    if(window.getSelection){ 
     userSelection=window.getSelection(); 
    } 
    else if(document.selection){ 
     userSelection=document.selection.createRange(); 
    } 
    selectedText=userSelection; 
    if(userSelection.text){ 
     selectedText=userSelection.text;   
    } 
    if(/msie|MSIE/.test(navigator.userAgent) == false){ 
     selectedText=selectedText.toString(); 
    } 
    origRange = userSelection;

Я позже меняю выбор (успешно). Я делаю это по диапазону в IE и идентификатором dom в ffx. Но после этого я хочу, чтобы отступил назад выбор до исходного.

Это работает как шарм в IE:

setTimeout(function(){ 
    origRange.select(); 
},1000);

Я хотел бы сделать что-то подобное в FFX:

var s = w.getSelection(); 
setTimeout(function(){ 
    s.removeAllRanges(); 
    s.addRange(origRange); 
},1000);

К сожалению, FFX не был кооперативным, и это не работает , Есть идеи?

источник

2010-04-19 Matrym

Можете ли вы показать нам какой-то код?Нам будет легче видеть, что происходит. Я полагаю, вы читаете https://developer.mozilla.org/en/DOM/Selection –

Короткий ответ: IE и другие браузеры отличаются в своей реализации выбора текста с использованием JavaScript (IE имеет свои собственные методы). Посмотрите на Selecting text with JavaScript.

Также см. setSelectionRange в MDC.

EDIT: После создания небольшого тестового примера проблема становится ясной.

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="UTF-8"> 
    <title>addRange test</title> 
    <style> 
     #trigger { background: lightgreen } 
    </style> 
    </head> 
    <body> 
    <p id="test">This is some (rather short) text.</p> 
    <span id="trigger">Trigger testCase().</span> 
    <script> 
var origRange; 

var reselectFunc = function() { 
    var savedRange = origRange; 
    savedRange.removeAllRanges(); 
    savedRange.addRange(origRange); 
}; 

var testCase = function() { 
    // Before modifying selection, save it 
    var userSelection,selectedText = ''; 

    if(window.getSelection){ 
     userSelection=window.getSelection(); 
    } 
    else if(document.selection){ 
     userSelection=document.selection.createRange(); 
    } 
    selectedText=userSelection; 
    if(userSelection.text){ 
     selectedText=userSelection.text; 
    } 
    if(/msie|MSIE/.test(navigator.userAgent) === false){ 
     /* you shouldn't do this kind of browser sniffing, 
      users of Opera and WebKit based browsers 
      can easily spoof the UA string */ 
     selectedText=selectedText.toString(); 
    } 
    origRange = userSelection; 

    window.setTimeout(reselectFunc, 1000); 
}; 

window.onload = function() { 
    var el = document.getElementById("trigger"); 
    el.onmouseover = testCase; 
}; 
    </script> 
    </body> 
</html>

При тестировании этого в Firefox, Chromium и Opera, отладочные инструменты показывают, что после вызова removeAllRanges в reselectFunc, как savedRange и origRange сбрасываются. Вызов addRange с таким объектом вызывает исключение быть выброшен в Firefox:

неперехваченное исключение: [Exception ... "Не удалось преобразовать JavaScript рассуждение ARG 0 [nsISelection.addRange]" nsresult: «0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)» место: "JS рамка :: файл: ///home/mk/tests/addrange.html :: анонимным :: строка 19" данные: нет]

нет необходимости в скажем, что во всех трех браузерах ни один текст не выбирается редактор

Видимо, это по назначению. Все переменные, назначенные объекту выбора (DOM), сбрасываются после вызова removeAllRanges.

источник

2010-04-19 23:37:15

Спасибо, это полезно, но я не думаю, что полностью решает мою проблему. Он использует «Поле», которое, я думаю, подразумевает, что текст находится в текстовой области/входе. Я хотел бы иметь возможность устанавливать диапазон и выбор для нескольких элементов dom (таким образом, фрагмент). Вы знаете, как это сделать? – Matrym

@Matrym: Я добавил тестовый файл после того, как вы редактировали свой вопрос –

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

я не мог бы сделать это без вас, и предоставить вам правильный ответ на него: D

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>addRange test</title> 
    <style> 
     #trigger { background: lightgreen } 
    </style> 
    </head> 
    <body> 
    <p id="switch">Switch to this text</p> 
    <p id="test">This is some (rather short) text.</p> 
    <span id="trigger">Trigger testCase().</span> 
    <script> 
var origRange; 
var s = window.getSelection(); 

var reselectFunc = function() { 
    s.removeAllRanges(); 
    s.addRange(origRange); 
}; 

var testCase = function() { 
// Before modifying selection, save it 
var userSelection,selectedText = ''; 

if(window.getSelection){ 
    userSelection=window.getSelection(); 
} 
else if(document.selection){ 
    userSelection=document.selection.createRange(); 
} 
selectedText=userSelection; 
if(userSelection.text){ 
    selectedText=userSelection.text; 
} 
if(/msie|MSIE/.test(navigator.userAgent) === false){ 
    /* you shouldn't do this kind of browser sniffing, 
     users of Opera and WebKit based browsers 
     can easily spoof the UA string */ 
    selectedText=selectedText.toString(); 
} 
origRange = userSelection; 




var range = s.getRangeAt(0); 
origRange = range.cloneRange(); 
var sasDom = document.getElementById("switch"); 
s.removeRange(range); 
range.selectNode(sasDom); 
s.addRange(range); 

window.setTimeout(reselectFunc, 1000); 
}; 
window.onload = function() { 
    var el = document.getElementById("trigger"); 
    el.onmouseover = testCase; 
}; 
    </script> 
</body> 
</html>

источник

2010-04-20 04:48:22 Matrym

Huh. Мне пришлось переключить его обратно на s.removeAllRanges(); потому что хром не признал это иначе. Но делать это было нормально - до тех пор, пока сначала будет сделан клон первоначального диапазона выбора. – Matrym

Добро пожаловать (хотя я думаю, что это поведение странно, но я напишу еще один вопрос). Одно предупреждение: не используйте короткие глобальные переменные, такие как 's' (или даже' i'), поскольку другие компоненты в браузере могут также использовать их, что приводит к неожиданному поведению (лучше всего использовать один глобальный объект, к которому относятся все остальные переменные, функции, объекты и т. д.). –

Это может вас заинтересовать: http://blog.siteroller.net/understanding-javascript-selection-and-range – SamGoody

ответ

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