在光标使用Javascript/jquery的位置插入文本
在光标使用Javascript/jquery的位置插入文本
提问于 2009-06-30 14:47:42
我有一个有很多文本框的页面。当有人点击链接时，我希望在光标所在的位置插入一个或两个单词，或者将其附加到具有焦点的文本框中。
例如，如果光标/焦点在一个文本框上，显示为'apple‘，而他点击了一个显示为'email’的链接，那么我希望文本框显示为'apple bob@example.com‘。
我该怎么做呢？既然焦点在单选/下拉/非文本框元素上，这是可能的吗？上一次聚焦在文本框上的内容还能被记住吗？
回答 7
Stack Overflow用户
回答已采纳
发布于 2009-06-30 14:56:48
使用这个，来自here
function insertAtCaret(areaId, text) {
var txtarea = document.getElementById(areaId);
if (!txtarea) {
return;
}
var scrollPos = txtarea.scrollTop;
var strPos = 0;
var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ?
"ff" : (document.selection ? "ie" : false));
if (br == "ie") {
txtarea.focus();
var range = document.selection.createRange();
range.moveStart('character', -txtarea.value.length);
strPos = range.text.length;
} else if (br == "ff") {
strPos = txtarea.selectionStart;
}
var front = (txtarea.value).substring(0, strPos);
var back = (txtarea.value).substring(strPos, txtarea.value.length);
txtarea.value = front + text + back;
strPos = strPos + text.length;
if (br == "ie") {
txtarea.focus();
var ieRange = document.selection.createRange();
ieRange.moveStart('character', -txtarea.value.length);
ieRange.moveStart('character', strPos);
ieRange.moveEnd('character', 0);
ieRange.select();
} else if (br == "ff") {
txtarea.selectionStart = strPos;
txtarea.selectionEnd = strPos;
txtarea.focus();
}
txtarea.scrollTop = scrollPos;
}<textarea id="textareaid"></textarea>
<a href="#" onclick="insertAtCaret('textareaid', 'text to insert');return false;">Click Here to Insert</a>
Stack Overflow用户
发布于 2013-04-13 01:04:28
也许更短的版本会更容易理解？
jQuery("#btn").on('click', function() {
var $txt = jQuery("#txt");
var caretPos = $txt[0].selectionStart;
var textAreaTxt = $txt.val();
var txtToAdd = "stuff";
$txt.val(textAreaTxt.substring(0, caretPos) + txtToAdd + textAreaTxt.substring(caretPos) );
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<textarea id="txt" rows="15" cols="70">There is some text here.</textarea>
<input type="button" id="btn" value="OK" />
我写这篇文章是为了回应How to add a text to a textbox from the current position of the pointer with jquery?
Stack Overflow用户
发布于 2015-02-06 04:33:50
George Claghorn认可的答案对于简单地在光标位置插入文本非常有效。但是，如果用户选择了文本，而您希望替换该文本(大多数文本的默认体验)，则需要在设置'back‘变量时进行小的更改。
此外，如果你不需要支持旧版本的IE，现代版本支持textarea.selectionStart，所以你可以去掉所有的浏览器检测和IE特定的代码。
这是一个简化的版本，至少适用于Chrome和IE11，并处理替换选定的文本。
function insertAtCaret(areaId, text) {
var txtarea = document.getElementById(areaId);
var scrollPos = txtarea.scrollTop;
var caretPos = txtarea.selectionStart;
var front = (txtarea.value).substring(0, caretPos);
var back = (txtarea.value).substring(txtarea.selectionEnd, txtarea.value.length);
txtarea.value = front + text + back;
caretPos = caretPos + text.length;
txtarea.selectionStart = caretPos;
txtarea.selectionEnd = caretPos;
txtarea.focus();
txtarea.scrollTop = scrollPos;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1064089
复制相关文章
相似问题
腾讯云开发者
