Question

我想停止在textBox中选择文本，并在textBox通过TAB按键聚焦时将光标设置为最后。我怎样才能做到这一点？请建议我。我尝试使用以下代码进行Google搜索

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test Document</title>
<script type="text/javascript">
function cursorLast(){
//    var no = document.getElementById('get').length;
    setCaretPosition(document.getElementById('get'),4);

}

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();
    }
}


</script>
</head>

<body>

  <form method="get" id="searchform" action="#" >
    <input type="text" onblur="if (this.value == '') {this.value = 'test';}" onfocus="if (this.value == 'test') {this.value = '';}" value="test" name="s" />
        <br /><br />
    <input type="text" value="test" name="s" id="get" onfocus="cursorLast();"/>
  </form>

</body>
</html>

此代码无效。

提前致谢。

Answer 1

您可以通过捕获第一个输入的keydown事件然后阻止默认选项卡行为来执行此操作。

<head>
    <script type="text/javascript">
        function KeyDownHandler(event)
        {
            var e = event.which || event.keyCode;
            if (e == 9)
            {
                event.preventDefault();
                setCaretPosition(document.getElementById('get'), 4);
            }
        }

        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();
            }
        }
    </script>
</head>
<body>
    <form>
        <input type="text" value="test" name="s" onkeydown="KeyDownHandler(event);" />
        <br /><br />
        <input type="text" value="test" name="s" id="get" />
    </form>
 </body>

Answer 2

另一个棘手的解决方案。

<head>
        <script type="text/javascript">
           function setCursorLast(elem){
               var elemId = elem.id;
               var pos = $(elem).attr("value").toString().length;
              setTimeout(function(){setCaretPosition(document.getElementById(elemId), pos)}, 1);
           }


function setCaretPosition(ctrl, pos){
    if (ctrl.setSelectionRange){ // for FF
        ctrl.focus();
        ctrl.setSelectionRange(pos, pos);
    }
    else if (ctrl.createTextRange){ // for IE
        var range = ctrl.createTextRange();
        range.collapse(true);
        range.moveEnd('character', pos);
        range.moveStart('character', pos);
        range.select();
    }
}
    </script>
</head>
<body>
    <form>
        <input type="text" value="test" name="s" />
        <br /><br />
        <input type="text" value="test" name="s" id="get" onfocus="seCursorLast(this)"/>
    </form>
 </body>

如何停止在textBox中选择文本并将光标设置为在textBox通过javascript中的TAB按键聚焦时持续？

2 个答案: