什么是最好的方法(我假设最简单的方法)，以放置光标在文本的输入文本元素的末尾通过JavaScript -焦点已设置到元素?
当前回答
仍然需要中间变量，(参见var val=) 否则光标的行为很奇怪，我们需要它在最后。
<body onload="document.getElementById('userinput').focus();">
<form>
<input id="userinput" onfocus="var val=this.value; this.value=''; this.value= val;"
class=large type="text" size="10" maxlength="50" value="beans" name="myinput">
</form>
</body>
其他回答
有一种简单的方法可以让它在大多数浏览器中工作。
this.selectionStart = this.selectionEnd = this.value.length;
然而，由于一些浏览器的特性，一个更全面的答案是这样的
setTimeout(function(){ that.selectionStart = that.selectionEnd = 10000; }, 0);
使用jQuery(设置监听器，否则不需要)
$ (' # el) .focus(函数(){ Var that = this; () {setTimeout(函数。selectionStart = that。selectionEnd = 10000;},0); })； < script src = " https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js " > < /脚本> <input id='el' type='text' value='put cursor at end'>
使用Vanilla JS(从答案中借用addEvent函数)
//基本的跨浏览器addEvent 函数addEvent(elem，事件，fn){ 如果(elem.addEventListener) { 初步的。addEventListener(事件，fn, false); 其他}{ 初步的。attachEvent(“on”+事件， 函数(){返回(fn。调用(elem window.event));})； }} var element = document.getElementById('el'); addEvent(元素、“焦点”函数(){ Var that = this; () {setTimeout(函数。selectionStart = that。selectionEnd = 10000;},0); })； <input id='el' type='text' value='put cursor at end'>
怪癖
Chrome有一个奇怪的怪癖，焦点事件在光标移动到字段之前被触发;这打乱了我简单的解决方案。有两个选项可以解决这个问题:
您可以添加一个0毫秒的超时(将操作延迟到堆栈清空为止) 您可以将事件从焦点更改为鼠标悬停。这对用户来说是相当烦人的，除非你仍然保持焦点。这两种选择我都不太喜欢。
此外，@vladkras指出，一些旧版本的Opera在有空格时，会错误地计算长度。为此，你可以使用一个巨大的数字，应该大于你的字符串。
下面是我的答案的jsFiddle演示。演示使用CoffeeScript，但如果需要，可以将其转换为纯JavaScript。
JavaScript中重要的部分是:
var endIndex = textField.value.length;
if (textField.setSelectionRange) {
textField.setSelectionRange(endIndex, endIndex);
}
我把这个答案贴出来是因为我已经为有同样问题的其他人写过了。这个答案不像上面的答案那样涵盖那么多的边缘情况，但它适合我，并且有一个jsFiddle演示可以玩。
下面是来自jsFiddle的代码，所以即使jsFiddle消失了，这个答案也会被保留:
moveCursorToEnd = (textField) ->
endIndex = textField.value.length
if textField.setSelectionRange
textField.setSelectionRange(endIndex, endIndex)
jQuery ->
$('.that-field').on 'click', ->
moveCursorToEnd(this)
<div class="field">
<label for="pressure">Blood pressure</label>:
<input class="that-field" type="text" name="pressure" id="pressure" value="24">
</div>
<p>
Try clicking in the text field. The cursor will always jump to the end.
</p>
body {
margin: 1em;
}
.field {
margin-bottom: 1em;
}
拿出一些答案。制作单行jquery。
$('#search').focus().val($('#search').val());
<script type="text/javascript">
function SetEnd(txt) {
if (txt.createTextRange) {
//IE
var FieldRange = txt.createTextRange();
FieldRange.moveStart('character', txt.value.length);
FieldRange.collapse();
FieldRange.select();
}
else {
//Firefox and Opera
txt.focus();
var length = txt.value.length;
txt.setSelectionRange(length, length);
}
}
</script>
我在IE9和Firefox 6中使用了这个功能。和Opera 11.x
我以前尝试过这些建议，但没有一个对我有效(在Chrome中测试了它们)，所以我写了自己的代码-它在Firefox, IE, Safari, Chrome中工作得很好……
在短信中：
onfocus() = sendCursorToEnd(this);
在Javascript中:
function sendCursorToEnd(obj) {
var value = obj.value; //store the value of the element
var message = "";
if (value != "") {
message = value + "\n";
};
$(obj).focus().val(message);}
