我正在使用jQuery,并尝试找到一种跨浏览器的方法来获取<textarea>
和 input
元素中插入符的像素坐标,以便我可以在该位置周围放置一个绝对定位的
元素。
是否有一些jQuery插件或JavaScript代码片段可以实现这个功能?
我正在使用jQuery,并尝试找到一种跨浏览器的方法来获取<textarea>
和 input
元素中插入符的像素坐标,以便我可以在该位置周围放置一个绝对定位的
是否有一些jQuery插件或JavaScript代码片段可以实现这个功能?
我在寻找一个与meteor-autocomplete兼容的文本区域插件,于是我评估了GitHub上的8个插件。迄今为止,胜利者是来自Component的textarea-caret-position插件。
创建一个镜像 <div>
并在屏幕外设置其样式与 <textarea>
完全相同。然后,将文本框中光标之前的文本复制到 div 中,并在其右侧插入一个 <span>
。接着,将 span 的文本内容设置为文本框中剩余的文本,以忠实地再现 faux div 中的换行。
这是唯一保证处理所有关于长行包装的边缘情况的方法。GitHub 也使用它来确定其@用户下拉菜单的位置。
如果输入字段没有焦点,您可能会发现两者都没有设置。 我已经成功地使用以下代码在当前光标位置插入文本,并替换当前选择(如果存在)。 根据具体的浏览器,结果可能有所不同。
function insertAtCursor(myField, myValue) {
/* selecion model - ie */
if (document.selection) {
myField.focus();
sel = document.selection.createRange();
sel.text = myValue;
}
/* field.selectionstart/end firefox */
else if (myField.selectionStart || myField.selectionStart == '0' ) {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
myField.value = myField.value.substring(0, startPos)
+ myValue
+ myField.value.substring(endPos, myField.value.length);
myField.selectionStart = startPos + myValue.length;
myField.selectionEnd = startPos + myValue.length;
myField.focus();
}
// cursor not active/present
else {
myField.value += myValue;
}