隐藏文本字段闪烁的光标

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-index等将一个输入字段恰好定位在另一个输入字段的上方。然后，使顶部输入字段完全透明，没有焦点，没有颜色等。您需要将可见的较低输入设置为禁用，以便仅显示上述输入的内容，但实际上不起作用。

Javascript部分：

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

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

Answer 2

我正在寻找一种方法来隐藏可触发日历的日期输入的iOS设备上闪烁的光标，因为您可能会看到光标在日历选择器顶部闪烁。

input:focus { text-indent: -9999em; }

因此，在这种情况下，我的CSS可以很好地工作，很明显的缺点是，如果您需要查看所键入的内容，那就不好了