[英]Select range in contenteditable div
我有一個contenteditable
div和幾個段落。
這是我的代碼:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<div id="main" contenteditable="true"
style="border:solid 1px black; width:300px; height:300px">
<div>Hello world!</div>
<div>
<br>
</div>
<div>This is a paragraph</div>
</div>
</body>
</html>
假設,我想做一個范圍選擇,其中包含字符串“world!This is”
怎么做?
一旦掌握了包含要突出顯示的文本的文本節點,就很容易了。 你如何得到這些取決於你需要的通用性。 就目前而言,在用戶編輯之前,以下內容將起作用:
var mainDiv = document.getElementById("main");
var startNode = mainDiv.firstChild.firstChild;
var endNode = mainDiv.childNodes[2].firstChild;
var range = document.createRange();
range.setStart(startNode, 6); // 6 is the offset of "world" within "Hello world"
range.setEnd(endNode, 7); // 7 is the length of "this is"
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.