每次我尝试时,它都会给我一个 p
标签,即使母鹿的父级应该是 span
var sel = window.getSelection();
console.log(sel.getRangeAt(0));
是否有任何解决方案或方法可以做到这一点,或者有一些有用信息的链接如何做到这一点?
最佳答案
使用范围
属性startContainer , endContainer和 commonAncestorContainer确定包含元素的选择。
在以下示例中,选择文本“bbb”并按按钮“press me”。正如预期的那样,commonAncestorContainer 是 span
元素:
$('#pressme').click(function(){
var rng = window.getSelection().getRangeAt(0);
alert(rng.commonAncestorContainer.parentNode.tagName);
});
#editor {
width: 500px;
height: 400px;
padding: 4px;
border: solid 1px gray;
margin-bottom: 4px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='editor' contenteditable='true'>aaa <span style="color:red">bbb</span> ccc</div>
<input id='pressme' type='button' value='press me' />
尝试选择文本的各个部分,看看它如何改变结果。
关于javascript - 如何使用 contenteditable 获取 div 元素内标记文本的父元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29073612/