我正在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
标记内
没有图书馆,我想学习这些东西:)
答案 0 :(得分:8)
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>