如何更改textarea中的闪烁光标/插入符号

我有一个textarea透明文本，其底层pre通过js显示文本，因此它看起来像用户正在输入动态文本。它的工作原理与背景颜色on this Regex Tester的概念相同，但我正在更改文本颜色和背景颜色，所以我希望在textarea中使用透明文本。如何更改textarea中的闪烁光标/插入符号

但是，将textarea的颜色定义为透明，也会使闪烁的光标变为透明，这会让人迷惑不解。有没有办法只改变闪烁的游标颜色，或只改变文本的颜色，不影响闪烁的光标？

我浏览过其他问题，但他们没有提供足够的答案。

注：我指的是闪烁的textarea符号，而不是鼠标光标。当你点击一个textarea或一个文本输入时，一个闪烁的textarea“光标”或插入符弹出。这个问题是关于这个问题的，而不是关于鼠标光标的。

来源

2013-12-16 James G.

http://stackoverflow.com/questions/6092963/can-i-change-the-linking-caret-in-a-form-text-area-in-a-browser – akash

这个问题是从2011年，与“简单的答案是你不能......”@akash请注意我的问题中的最后一行。 –

http://stackoverflow.com/questions/10682587/is-there-any-way-to-change-just-the-color-of-the-textarea-cursor-without-changin – akash

最简单的办法，但前提是你使用等宽字体（如快递或宋体）工作 - 不设置文本区域的颜色为透明，但的keyDown与欧洲工商管理学院的任何其他字符空格填充：

on keyDown ↓ 
get the character ↓ 
put it in the underlaying <pre> tag ↓ 
put a space in the textarea

您需要获得插入符的位置才能将空格和字符放在适当的位置，但已有脚本（例如this one）。

我可以为你创建一个小提琴/ plunkr例子，如果你想。

如果您使用的字体不是等宽字体，但是您使用的是<pre>标签，那么您应该确定这个标签（如果有人很好奇，我可以描述这些不重要的，耗时的肯定不是IE兼容的方法，我没有想到等宽字体）。

编辑：实际上，您也可以从透明textarea中获取插入符号位置，并将1px宽的黑色div移动到正确位置（对于不等宽字体）。您也可以使用CSS动画或Javascript使其闪烁。

来源

2014-07-30 15:20:35 Killah

如何更改textarea中的闪烁光标/插入符号

回答

相关问题