JS textaera 在选中文本后插入新的文本

27 min read

要在选中的文本后插入新的文本,可以使用 JavaScript 的 Range 对象和 Document 对象的 execCommand() 方法。

以下是示例代码:

var textarea = document.getElementById("myTextarea"); // 获取文本框元素
var startPos = textarea.selectionStart; // 获取选中文本的起始位置
var endPos = textarea.selectionEnd; // 获取选中文本的结束位置
var selectedText = textarea.value.substring(startPos, endPos); // 获取选中的文本内容
var newText = "Hello World"; // 要插入的新文本内容
var beforeText = textarea.value.substring(0, startPos); // 选中文本之前的文本内容
var afterText = textarea.value.substring(endPos, textarea.value.length); // 选中文本之后的文本内容

// 使用 execCommand()方法插入新文本
document.execCommand("insertText", false, newText);

// 将插入的文本与之前和之后的文本重新组合为新的文本内容
var updatedText = beforeText + selectedText + newText + afterText;

// 将文本框的值更新为新文本内容
textarea.value = updatedText;

// 将光标移动到新增的文本之后
var newPos = startPos + newText.length;
textarea.setSelectionRange(newPos, newPos);

该代码将在选中文本后插入新的文本,“Hello World”,并在选中文本的后面放置光标。