Javascript: родительский узел Detect Carets - PullRequest
Новая
       16

Javascript: родительский узел Detect Carets

5 голосов
/ 06 февраля 2011

Я создаю простой редактор WYSIWYG внутри iframe с включенным designMode, в настоящее время я могу сделать выделенный текст жирным, курсивом, подчеркиванием и ссылками, и они отлично работают.

Но я бы хотел знать, когда caret находится внутри b, i, u, a, теги, чтобы я мог уведомить пользователя о том, что текущее выделение выделено жирным шрифтом или что-то подобное.

Примеры:

Hello <b>Stackover|flow</b> is cool! = Вы внутри тега b

<i>Be|st place</i>! = Вы внутри тега i

Hello <a href="http://stackoverflow.com/">Go|od stuff!</a> = Вы внутри тега a

Нет библиотек, пожалуйста, я хотел бы изучить этот материал:)

1 Ответ

8 голосов
/ 06 февраля 2011

MSIE lte 8: TextRange.parentElement ()

Другие: DOMRange.commonAncestorContainer 

<script type="text/javascript">
<!--
function fx()
{

  var target=null;
  if(window.getSelection)
  {
    target=window.getSelection().getRangeAt(0).commonAncestorContainer;
    return((target.nodeType===1)?target:target.parentNode);
  }
  else if(document.selection)
  {
    var target=document.selection.createRange().parentElement();
  }
  return target;
}
//-->
</script>
<input type="button" onclick="alert(fx().tagName)" value="click">
<div id="editor" contenteditable="true">
Hello <b>Stackoverflow</b> is cool! <i>Best place</i>
Hello <a href="http://stackoverflow.com/">Good stuff!</a>
</div>
...