• JS控制光标定位,定位到文本的某个位置


    这是一个数字密码,要能够智能的跳转到文本的某个位置,就需要通过JS来控制跳转!

    1.onkeyup监听

    <input class="put" id="number-password-input" type="tel" maxlength="12" tabindex="6" onkeyup="dealKeyup(this);">
    

    2.智能判断

    // 光标定位
    function dealKeyup(that) {
        var input_val = $(that).val();
        var input_arr = input_val.split("-");
        for(var i=0;i<input_arr.length;i++) {
            if (input_arr[i] == ' ') {
                setCaretPosition(that, i*2);
                return;
            }
        }
    }
    

    这个方法,获取输入框的值,处理成数组。遍历数组,找寻到第一个为空的位置,定位到这个位置。

    3.处理光标定位

    // 获取光标位置
    function getCursortPosition(ctrl) {
        var CaretPos = 0;   // IE Support
        if (document.selection) {
            ctrl.focus();
            var Sel = document.selection.createRange();
            Sel.moveStart ('character', -ctrl.value.length);
            CaretPos = Sel.text.length;
        }
        // Firefox support
        else if (ctrl.selectionStart || ctrl.selectionStart == '0')
            CaretPos = ctrl.selectionStart;
        return (CaretPos);
    }
    
    // 设置光标位置
    function setCaretPosition(ctrl, pos){
        if(ctrl.setSelectionRange)
        {
            ctrl.focus();
            ctrl.setSelectionRange(pos,pos);
        }
        else if (ctrl.createTextRange) {
            var range = ctrl.createTextRange();
            range.collapse(true);
            range.moveEnd('character', pos);
            range.moveStart('character', pos);
            range.select();
        }
    }
    
    

    亲测可用!

    方法论:没想到js还可以这么玩定位,有意思!

  • 相关阅读:
    sql日期操作
    用户活跃状态模型
    R基于Bayes理论实现中文人员特性的性别判定
    python的一点小常识
    [工作技能]SVN
    北大计算所词性标注集简表
    c++ boost 汉字和模式串混用的例子
    SVN文本文件报二进制属性的问题
    我的R代码备份
    FaceBook Twitter实习生简历求内推
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/6510114.html
Copyright © 2020-2023  润新知