问题:
当某个文本框获得焦点时,将插入符号设置为文本框的末尾。该解决方案需要与 IE7、Opera、Chrome 和 Firefox 兼容。
为了使事情变得更简单,仅当文本框的当前值为固定值时才需要此行为。(说“初始化”)
不完整的解决方案:
有人会认为这很简单,但我找不到适用于所有浏览器的 SO 答案。以下答案不起作用:
$("#test").focus(function() {
// This works for Opera only
// Also tested with $(this).val($(this).val());
if (this.value == "INIT") {
this.value = "";
this.value = "INIT";
}
});
$("#test").focus(function() {
// This works for IE and for Opera
if (this.value == "INIT") {
setCaretPosition(this, 4);
}
});
我从 SO questions 中得到了 setCaretPosition 函数,并在不同的博客上看到了它:
function setCaretPosition(ctrl, pos) {
if (ctrl.setSelectionRange) {
//ctrl.focus(); // can't focus since we call this from focus()
// IE only
ctrl.setSelectionRange(pos, pos);
}
else if (ctrl.createTextRange) {
// Chrome, FF and Opera
var range = ctrl.createTextRange();
range.collapse(true);
range.moveEnd('character', pos); // Also tested with this
range.moveStart('character', pos); // and this line in comment
range.select();
}
}
小提琴
我已经设置了一个jsFiddle。