2014-11-11 2 views
0

EDIT: я нашел хорошее решение в этом посте Remove highlight added to selected text using JavaScript?Выделите включая различные узлы

I'm сделать скрипт для выделения текста. Я использую теги <span>. Эта часть была простой, но теперь я сталкиваюсь с проблемой. Когда выделение включает в себя разные узлы, мне нужно закрыть тег <span> до закрытия родителя и снова открыть de <span> в новом узле. Не очень хорошее объяснение, так что я положил пример:

<body> 

     <p id="0">Lorem ipsum</p> 

     <div id="1">dolor sit amet</div> 

    </body> 

Я выбираю для выделения:

ipsum</p><div id="1">dolor sit 

Тогда я должен закрыть <span> до </p> и открыт после <div> Programatically. Любые идеи, как я могу это сделать? Я предпочитаю делать весь сценарий с использованием чистого JavaScript, но любая помощь будет оценена.

Вот его моя функция, чтобы выделить:

function surroundSelection(element) { 



      if (window.getSelection) 
      { 
       var sel = window.getSelection(); 
       if (sel.rangeCount) 
       { 
        console.log (sel); 

        var range = sel.getRangeAt(0).cloneRange(); 



        range.surroundContents(element); 
        sel.removeAllRanges(); 
        sel.addRange(range); 



       } 
      } 
     } 

Где элемент будет тег (в моем случае <span>)

Вот это то, что у меня есть, с еще проблема подсветки различных узлов http://jsfiddle.net/nacles/4L6d57bs/

+0

Показать какой-либо предварительный просмотр или пример того, что вы хотите ... – Sandesh

ответ

0

Вы должны начать другую spam на каждой части кода вы, в вашем примере:

<span>ipsum</span></p><div id="1"><span>dolor sit</span> 

так для вас, просто поставить span в начале, а затем искать в конце строки или «<», если тег открывается как

то обратите внимание, что есть вложенный блок тег, если тег является близким, как

, тогда вы просто установите закрывающий интервал.

Есть много случаев, но я думаю, что это не очень сложно.

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