当前位置：首页> 正文

如何使用javascript在插入符号中插入字符？

How do I insert a character at the caret with javascript?

我想在按钮上使用javascript在文本框内的插入符号中插入一些特殊字符。该怎么办呢？

脚本需要找到活动的文本框，并在该文本框中的插入符号中插入字符。该脚本还需要在IE和Firefox中运行。

编辑：也可以在先前处于活动状态的文本框中插入字符" last"。

我认为杰森·科恩(Jason Cohen)是不正确的。失去焦点时，插入符号的位置将保留。

[编辑：添加了我最初没有的FireFox代码。]

[编辑：添加了确定最新活动文本框的代码。]

首先，您可以使用每个文本框的onBlur事件将变量设置为" this"，以便始终了解最新的活动文本框。

然后，有一种IE方式也可以在Opera中使用它来获取光标位置，而在Firefox中则更容易。

在IE中，基本概念是使用document.selection对象并将一些文本放入选择中。然后，使用indexOf，可以获得添加的文本的位置。

在FireFox中，有一个名为selectionStart的方法将为您提供光标位置。

一旦有了光标位置，就可以用

覆盖整个text.value

光标位置之前的文本要在光标位置之后插入的文本

这里是一个带有IE和FireFox单独链接的示例。您可以使用自己喜欢的浏览器检测方法来找出要运行的代码。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

<html><head></head><body>

<script language="JavaScript">


<form name="testform">
<input type="text" name="testtext1" onBlur="lasttext=this;">
<input type="text" name="testtext2" onBlur="lasttext=this;">
<input type="text" name="testtext3" onBlur="lasttext=this;">

</form>
Insert IE

Insert FF
</body></html>

这也适用于textareas。我不知道如何重新定位光标，使其停留在插入点。

根据您的更新：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

先前答案中的@bmb代码的屠宰版本也可以很好地将光标重新定位在插入字符的末尾：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

var lasttext;

function doinsert_ie() {
var ttInsert ="bla";
lasttext.focus();
var sel = document.selection.createRange();
sel.text = ttInsert;
sel.select();
}

function doinsert_ff() {
var oldtext = lasttext.value;
var curposS = lasttext.selectionStart;
var curposF = lasttext.selectionEnd;
pretext = oldtext.substring(0,curposS);
posttest = oldtext.substring(curposF,oldtext.length);
var ttInsert='bla';
lasttext.value = pretext + ttInsert + posttest;
lasttext.selectionStart=curposS+ttInsert.length;
lasttext.selectionEnd=curposS+ttInsert.length;
}

我不确定是否可以捕获插入符号的位置，但是如果可以，可以通过使用文本框的onblur事件捕获位置(相对于字符串)来避免Jason Cohen的担忧。

循环遍历所有输入字段...
找到一个有重点的人..
然后当您拥有文字区域时...
您应该能够执行类似...

myTextArea.value ='要在文本区域中插入的文本在此处';

请注意，如果用户按下按钮，则文本框上的焦点将丢失，并且没有插入符号的位置！

展开全文阅读