js输入框光标可以左右移动

在JavaScript中，输入框（<input> 或 <textarea>）的光标可以通过编程方式进行左右移动。以下是一些基础概念和相关方法：

基础概念

光标位置：指用户在输入框中输入文本时光标所在的位置。
Selection Range：表示用户选择的文本范围，也可以用来设置光标位置。

示例代码

以下是一个简单的示例，展示如何通过按钮点击事件来移动光标：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cursor Movement</title>
</head>
<body>
    <input type="text" id="myInput" value="Hello, World!">
    <button onclick="moveCursorLeft()">Move Left</button>
    <button onclick="moveCursorRight()">Move Right</button>

    <script>
        const input = document.getElementById('myInput');

        function moveCursorLeft() {
            let start = input.selectionStart;
            if (start > 0) {
                input.setSelectionRange(start - 1, start - 1);
                input.focus();
            }
        }

        function moveCursorRight() {
            let start = input.selectionStart;
            if (start < input.value.length) {
                input.setSelectionRange(start + 1, start + 1);
                input.focus();
            }
        }
    </script>
</body>
</html>