javascript 将光标放在javascript文本框的末尾
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/11860831/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Putting cursor at end of textbox in javascript
提问by michael
I have a textbox that when I put on focus I want the cursor to goto the end of the textbox.
我有一个文本框,当我获得焦点时,我希望光标移到文本框的末尾。
The solution that keeps coming up is just
不断出现的解决方案只是
this.value = this.value
I have tried this with a simple method onclick:
我用一个简单的方法 onclick 尝试了这个:
function InputClicked(element) {
element.className = "inputfocused";
element.value = element.value;
}
but the strange this with this, it seems to goto the end and then jump to the start of the textbox.
但奇怪的是这个,它似乎走到了最后,然后跳到了文本框的开头。
回答by Robert Koritnik
You have to focus element AND set caret position
您必须关注元素并设置插入符号位置
This JSFiddleshows you how it works. jQuery has been used for simplicity in this example, but it can be completely omitted if one desires so. setSelectionRange
function is a DOM function anyway.
这个JSFiddle向您展示了它是如何工作的。在这个例子中为了简单起见使用了 jQuery,但如果愿意,可以完全省略它。setSelectionRange
function 无论如何都是一个 DOM 函数。
In general it does this:
一般来说,它这样做:
input.focus();
input.setSelectionRange(inputValueLength, inputValueLength);
Obtaining input and its value length can be obtained using DOM functionality or using library functions (as in jQuery).
可以使用 DOM 功能或使用库函数(如在 jQuery 中)获取输入及其值长度。
Do we need input value length?
我们需要输入值长度吗?
I haven't tested in other browsers but running in Chrome it allows to set a larger than actual position and caret will be positioned at the end. So something like:
我没有在其他浏览器中测试过,但在 Chrome 中运行它允许设置比实际位置更大的位置,插入符号将被定位在最后。所以像:
input.setSelectionRange(1000,1000);
will work as expected (provided your text is shorter than 1000 characters. :)
将按预期工作(前提是您的文本少于 1000 个字符。:)
Note: This function isn't supported in IE8 and older. All latest versions of most used browsers support it. For older versions of IE resort to text ranges.
注意:IE8 及更早版本不支持此功能。最常用浏览器的所有最新版本都支持它。对于旧版本的 IE,请使用文本范围。
回答by Tim Down
You need to move the caret using either the selectionStart
and selectionEnd
properties or setSelectionRange()
method of the input. IE < 9 does not support these though, so you need to use the input's createTextRange()
method in those browsers.
你需要使用移动无论是插入符号selectionStart
和selectionEnd
属性或setSelectionRange()
输入法。IE < 9 不支持这些,所以你需要createTextRange()
在这些浏览器中使用输入的方法。
Code:
代码:
function moveCaretToEnd(el) {
el.focus();
if (typeof el.selectionStart == "number") {
el.selectionStart = el.selectionEnd = el.value.length;
} else if (typeof el.createTextRange != "undefined") {
var range = el.createTextRange();
range.collapse(false);
range.select();
}
}
回答by Arun Prasad E S
Simple And Working 100%
简单且工作 100%
1.Focus
2.Take the value
3.Empty It
4.Put the value back
$("#catg_name").focus();
var value = $("#catg_name").val();
$("#catg_name").val('');
$("#catg_name").val(value);