如何在当前光标位置将文本插入文本区域？

要将文本插入当前光标位置的文本区域/输入框，我们需要获取光标的当前位置。所以这里是获取光标当前位置的方法。

• 首先，借助 textarea/inputbox 上名为 selectionStart 的属性获取光标的当前位置。
• 要在给定位置插入文本，我们将使用 slice函数将字符串分成两部分，然后将这两部分附加到文本前面和结尾的文本（text_to_insert）。

句法：

// will give the current position of the cursor
document.getElementById("id").selectionStart; 

// will get the value of the text area
let x= $('#text1').val();

// will get the value of the input box
let text_to_insert=$('#insert').val();

// setting the updated value in the text area
$('#text1').val(x.slice(0,curPos)+text_to_insert+x.slice(curPos));

例子：

javascript

    
        
        
        
      
        Document
    
    
              
        
        
          Insert at current position
      
        
            function setTextToCurrentPos() {
                var curPos =
                    document.getElementById("text1").selectionStart;
                console.log(curPos);
                let x = $("#text1").val();
                let text_to_insert = $("#insert").val();
                $("#text1").val(
x.slice(0, curPos) + text_to_insert + x.slice(curPos));
            }
        
    

输出：

输出：1

单击在当前位置插入按钮后

解释：

这里，一个名为setTextToCurrentPos 的书面方法。单击在当前位置插入时，将调用此方法。

//document.getElementById('text1').selectionStart;

这一行给了我们光标的当前位置/开始位置。

示例：我是开发人员

如果我们的光标正好放在开发者之前。然后它将返回 7。因此，如使用切片方法的代码所示，我们可以在当前光标位置插入文本。

let x= $(‘#text1’).val(); // will get the value of the text area

 let text_to_insert=$(‘#insert’).val(); // will get the value of the input box

 $(‘#text1’).val(x.slice(0, curPos)+text_to_insert+x.slice(curPos));// setting the updated value in the text area