html - 隐藏文本字段闪烁光标

Question

我有一个文本字段，有办法隐藏闪烁的文本光标吗？我这么说是因为我正在做一个恐怖/神秘网站，线索之一就是开始在任何地方打字。

也许我可以用 JavaScript 来做到这一点？

Answer 1

基本思想是，光标的颜色与文本的颜色相同。因此，您要做的第一件事就是使文本透明，从而将光标移开。然后您可以使用文本阴影使文本再次可见。

使用此链接可查看 jsfiddle 中的实时内容.

input[type="text"]{
    color : transparent;
    text-shadow : 0 0 0 #000;
}
input[type="text"]:focus{
    outline : none;
}

更新:

已知不适用于 iOS 8 和 IE 11

<小时/>

我的另一个想法有点hacky并且需要javascript。

HTML 和 CSS 部分:

您创建 2 个输入字段，并使用 z 索引等将一个输入字段精确地放置在另一个输入字段的顶部。然后，您使顶部输入字段完全透明，没有焦点，没有颜色，等等。 您需要将可见的、较低的输入设置为禁用，这样它只显示上面输入的内容，但实际上不起作用。

Javascript部分:

完成上述操作后，您将同步两个输入。在按键或更改时，您将较高输入的内容复制到较低输入。

总结以上所有内容:您输入一个不可见的输入，当表单提交时，该输入将被发送到后端，但其中文本的每次更新都将回显到下方可见但禁用的输入字段中。