js在文本框光标前插入文字

在JavaScript中，如果你想在文本框的光标前插入文字，可以使用以下方法：

基础概念

光标位置：指用户在文本框中输入文字时光标所在的位置。
插入文字：在光标当前位置之前添加新的文本内容。

类型与应用场景

富文本编辑器：在复杂的文本编辑环境中，允许用户在特定位置插入格式化的文本。
表单填写：在用户填写表单时，可能需要动态地在输入框中添加提示信息或默认值。

示例代码

以下是一个简单的示例，展示如何在文本框的光标前插入文字：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Insert Text Before Cursor</title>
<script>
function insertTextAtCursor(text) {
    var input = document.getElementById('myInput');
    if (input.selectionStart || input.selectionStart == '0') {
        // 现代浏览器
        var startPos = input.selectionStart;
        var endPos = input.selectionEnd;
        input.value = input.value.substring(0, startPos) + text + input.value.substring(endPos, input.value.length);
        input.selectionStart = startPos + text.length;
        input.selectionEnd = startPos + text.length;
    } else if (document.selection && document.selection.createRange) {
        // IE 浏览器
        input.focus();
        var range = document.selection.createRange();
        range.text = text;
    }
}
</script>
</head>
<body>

<input type="text" id="myInput" value="Some text in the box">
<button onclick="insertTextAtCursor('INSERTED TEXT')">Insert Text</button>

</body>
</html>