Javascript:检测Carets父节点

Question

我正在iframe中使用designMode构建一个简单的WYSIWYG编辑器,目前我可以使所选文本变为粗体,斜体和下划线以及链接,并且它们工作正常.

但我想知道什么时候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标签内

没有图书馆,我想学习这个东西:)

Answer 1

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>