文本框末尾光标自动对焦答案

【问题标题】：Autofocus With Cursor On End Of Textbox文本框末尾光标自动对焦
【发布时间】：2015-01-03 20:44:58
【问题描述】：

我想将自动对焦放在 html 文本框上，使光标指向文本框中已存在的某些文本的末尾。我知道自动对焦属性的作用。而且我还看到了put cursor at end of text input's value，它回答了如何将光标放在末尾，但是文本框在页面重新加载时不会自动聚焦。我怎样才能做到这两点 - 在页面重新加载时自动聚焦文本框并将光标放在文本末尾？

Code : 

 <textarea id="txtArea" style="width:106%; height:100px" align="center" name="task1" onkeypress="onTestChange();" onfocus="this.value = this.value;" autofocus ><?php echo $_GET["task"];?></textarea>

我想在文本回显后放置光标。不是textarea的值。

我提到的文本框也是Textarea。

【问题讨论】：

stackoverflow.com/questions/20252449/…
jsfiddle.net/fuhhxcrk 你想要这样的东西吗。
尝试运行上面的代码
@kki3908050 不工作光标仍然只指向开头

标签： javascript jquery html css web

【解决方案1】：

请使用此代码并在您的浏览器中运行

$(document).ready(function() {
  
    var input = $("#test");
    var len = input.val().length;
    input[0].focus();
    input[0].setSelectionRange(len, len);

});

&lt;input type="text" id="test" autofocus value="value text" /&gt;

【讨论】：

【解决方案2】：

尝试运行这个简单的代码，你会注意到第一个文本框将被聚焦，而不是第二个

<input type="text" autofocus value="value text" onfocus="this.value = this.value;"/>
<input type="text" autofocus value="value text" onfocus="this.value = this.value;"/>

【讨论】：

【解决方案3】：

$( document ).ready(function() {

 var t =$("#txtID");    

 t.focus().val(t.val());

});

【讨论】：

【解决方案4】：

在this question 上检查chris G's answer。将焦点设置到文本框后调用函数：

   function SetCaretAtEnd(elem) {
            var elemLen = elem.value.length;
            // For IE Only
            if (document.selection) {
                // Set focus
                elem.focus();
                // Use IE Ranges
                var oSel = document.selection.createRange();
                // Reset position to 0 & then set at end
                oSel.moveStart('character', -elemLen);
                oSel.moveStart('character', elemLen);
                oSel.moveEnd('character', 0);
                oSel.select();
            }
            else if (elem.selectionStart || elem.selectionStart == '0') {
                // Firefox/Chrome
                elem.selectionStart = elemLen;
                elem.selectionEnd = elemLen;
                elem.focus();
            } // if
        } // SetCaretAtEnd()

【讨论】：

【解决方案5】：

链接的答案已经自动关注页面加载。

<input type="text" autofocus value="value text" onfocus="this.value = this.value;"/>

JS Fiddle

【讨论】：

就像张贴者所说的那样，这只适用于第一次加载。他希望它专注于每个请求

【解决方案6】：

类似的东西。聚焦它，然后重新设置值。

<input type="text" value="this holds a value" id="element"/>

<script>
$(window).ready(function(){
   $("#element").focus(); 
   $("#element").val($("#element").val());
});
</script>

【讨论】：