只隐藏输入字段的内容 [英] Hide only the content of an input field

问题描述

我有一个跨度与我的输入字段重叠，当您在输入字段中键入内容时，它会更新其内容。

即使我将跨度完美地放置在输入文本上，仍然可以看到文本更粗体，字母更粗。

（field nr.1- with span，nr.2- without）

我试着隐藏整个输入字段，但是光标也消失了，没有这些输入就非常混乱。

有没有一种方法可以隐藏输入字段的文本？

解决方案

只需将输入文本设置为不可见，并将光标置为黑色：

<

  #box {color：transparent;光标颜色：黑色; }  

< input type =textid = boxvalue =some_sample_text>

文字是不可见的，但是会出现。随着你的跨度覆盖这应该是你想要的。但是不要忘记你的输入字段必须具有相同的大小和字体大小，或者插入符号位置不正确。

I have a span overlapping my input field, that updates its content as you type into the input field.

Even though I positioned the span perfectly on the input text, you can still see that the text is a little more bold and letters are thicker.

(field nr.1- with span, nr.2- without)

I tried hiding the entire input field, but then also the cursor disappears, without which typing is very confusing.

Is there a way that I could hide only the text of the input field?

解决方案

Just set your input text invisible and the cursor black by:

  #box {
      color: transparent;
      caret-color: black;
    }

<input type="text" id="box" value="some_sample_text">

So this way the text is invisible but the currsor shows up. With your span overlaying this should be exactly what you want. But don´t forget your input field must have the same size and fontsize or the caret is on the wrong position.

这篇关于只隐藏输入字段的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！