Выбор диапазона и Mozilla - PullRequest
Новая
       54

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

1 голос
/ 20 апреля 2010

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

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

    // 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 ID в ffx. Но после того, как я это сделаю, я хочу вернуть выбор к исходному.

Это работает как брелок в IE: 

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

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

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

К сожалению, FFX не сотрудничал, и это не работает. Есть идеи?

Ответы [ 2 ]

1 голос
/ 20 апреля 2010

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

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

РЕДАКТИРОВАТЬ : После небольшого теста, проблема становится понятной. 

<!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:

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

Нет необходимости говорить, что во всех трех браузерах текст не выделен.

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

0 голосов
/ 20 апреля 2010

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

Я не смог бы сделать это без тебя, и дать тебе правильный ответ: 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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...