在文本字段中插入文本后聚焦光标

Focus cursor after inserting text in textfield

本文关键字：聚焦 光标 插入文本 文本 字段      更新时间：2023-09-26

我做了以下函数将消息（msg）插入文本字段。

插入文本后，光标需要位于输入的消息的最后一个字符之后。文本字段已包含一些文本。

当我插入消息时，光标聚焦在味精末尾附近的某个地方，但肯定不会在最后一个字符之后。似乎有些字符没有按 .length 计算？

     function insertAtCursor(msg) {
           var textArea = document.getElementsByName("message")[0];
           textArea.value = textArea.value.substr(0, textArea.selectionStart) + msg +        textArea.value.substr(textArea.selectionEnd);
           var endMsgPos = textArea.value.lastIndexOf(msg) + msg.length;
           textArea.setSelectionRange(endMsgPos, endMsgPos);
     }

不需要textArea.value.lastIndexOf(msg)。

function insertAtCursor(msg) {
    var textArea = document.getElementsByName("message")[0];
    var selStart = textArea.selectionStart, val = textArea.value;
    textArea.value = val.slice(0, selStart) + msg +
                     val.slice(textArea.selectionEnd);
    var endMsgPos = selStart + msg.length;
    textArea.setSelectionRange(endMsgPos, endMsgPos);
}
首先

，如果您尝试使用textArea.selectionStart，则IE 8会遇到问题，因为它使用不同的API。

其次，如果插入符号在字符串的乞求处并且末尾的某个地方存在 msg 的值，则lastIndexOf代码中的行为会很奇怪。

试试这个： 

   function insertAtCursor(msg) {
     var e = document.getElementsByName('message')[0],
     length = msg.length, val = e.value;
     /* mozilla / dom 3.0 */
     if ('selectionStart' in e){
       var partial = val.slice(0, e.selectionStart) + msg;
       e.value = partial + val.slice(e.selectionEnd);
       var end = partial.length; 
       e.setSelectionRange(end, end);
     }
     /* exploder */
     if (document.selection){
         e.focus();
         document.selection.createRange().text = msg;
     }
   }

演示在这里：http://jsbin.com/UnOBUbU/6

相关文章：