小编典典

获取输入type = text看起来像type = password

css

tl; dr

我有一个输入type=text,我想像type=password仅使用CSS 的输入一样显示星星。


基本上我有一个带有以下输入的表单:

<input type='text' value='hello' id='cake' />

我没有生成表单,根本没有访问它的HTML的权限。但是,我确实可以将CSS应用于该页面。

我想要的是使其表现为type=password,即-为用户输入的内容显示星号,而不是实际输入的文本。基本上,我希望该方面(用户输入的表示)看起来像一个type=password字段。

由于这似乎只是一个演示问题,所以我认为必须使用CSS来解决此问题,因为它属于责任领域。但是-我还没有找到这样的方法。我必须支持IE8
+,但我宁愿有一个仅适用于现代浏览器的解决方案,而根本没有解决方案。防止复制/粘贴功能的要点,但我可以没有。

注意: 如果不清楚,则无法将HTML或JavaScript添加到页面-仅添加CSS。


(我发现的只是这个问题,但是它正在处理与jQuery有关的问题,并且具有JavaScript解决方案)


阅读 387

收藏
2020-05-16

共1个答案

小编典典

就像@ThiefMaster建议的一样

input.pw {
    -webkit-text-security: disc;
}

但是,这将在webkit后代的浏览器中工作。Opera,Chrome和Safari,但对其余的支持不多,另一个解决方案是使用webfonts。

使用任何字体编辑实用程序(例如FontForge)来创建一种字体,其中所有字符都为*(或所需的任何符号)。然后使用CSS
Web字体将它们用作自定义字体。

2020-05-16