input 控制光标所在的位置

逆风优雅

于 2024-08-16 11:55:27 发布

阅读量382

点赞数 1

分类专栏： js 文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/qq_44603011/article/details/141255954

版权

js 专栏收录该内容

65 篇文章 1 订阅

订阅专栏

需求：鼠标一点击input输入框就要将焦点至于输入框的最后面，使用户不能在内容的中间删除或者修改

const focusEnd = (value) => {
    var inpEl = value.target // 获取dom元素

    console.log(inpEl, 'LLL');

    var length = value.target.value.length // 获取输入框文本的长度
    if (document.selection) { // 判断浏览器是否支持selection属性
        var range = inpEl.createTextRange() // 创建range对象
        range.moveStart('character', length) // 设置range对象的开始位置
        range.collapse() // 设置range对象的结束位置
        range.select() // 选择range对象
    } else if (typeof inpEl.selectionStart === 'number' && typeof inpEl.selectionEnd === 'number') { // selectionStart和selectionEnd两个属性是当前选中文本起始位置的索引
        inpEl.selectionStart = inpEl.selectionEnd = length // 设置光标位置
    }

}

可以通过length的值设置光标处于 input输入框所在的位置