javascript html 文本框插入文本,JavaScript在html文本框中设置键盘插入符的位置

小编典典

摘自Josh Stodola的使用Javascript在Textbox或TextArea中设置键盘插入符号的位置

通用功能，可让您在所需的文本框或文本区域的任何位置插入插入符号：

function setCaretPosition(elemId, caretPos) {

var elem = document.getElementById(elemId);

if(elem != null) {

if(elem.createTextRange) {

var range = elem.createTextRange();

range.move('character', caretPos);

range.select();

}

else {

if(elem.selectionStart) {

elem.focus();

elem.setSelectionRange(caretPos, caretPos);

}

else

elem.focus();

}

}

}

第一个预期参数是您希望插入键盘插入符号的元素的ID。如果找不到该元素，则不会发生任何事情(显然)。第二个参数是插入号位置索引。零将把键盘插入符号放在开头。如果您传递的数字大于elements值中的字符数，它将把键盘插入符号放在最后。

在IE6及更高版本，Firefox 2，Opera8，Netscape9，SeaMonkey和Safari上进行了测试。不幸的是，在Safari上，它无法与onfocus事件结合使用。

使用上述功能强制键盘插入符号在获得焦点时跳至页面上所有文本区域的末尾的示例：

function addLoadEvent(func) {

if(typeof window.onload != 'function') {

window.onload = func;

}

else {

if(func) {

var oldLoad = window.onload;

window.onload = function() {

if(oldLoad)

oldLoad();

func();

}

}

}

}

// The setCaretPosition function belongs right here!

function setTextAreasOnFocus() {

/***

* This function will force the keyboard caret to be positioned

* at the end of all textareas when they receive focus.

*/

var textAreas = document.getElementsByTagName('textarea');

for(var i = 0; i < textAreas.length; i++) {

textAreas[i].onfocus = function() {

setCaretPosition(this.id, this.value.length);

}

}

textAreas = null;

}

addLoadEvent(setTextAreasOnFocus);

2020-04-25