我有一个<form>
,其中包含几个文本输入字段,如下所示:
<input id="reg" type="text" name="reg" style="width: 200px;" class="eztext">
在<script>
之前的</body>
部分,我有代码为所有这些字段选择一种字体:
var el = document.getElementsByClassName("eztext")
for (var i = 0; i < el.length; i++)
{
el[i].style.fontSize = "30px";
el[i].style.backgroundColor = "#00ff00"; // bright green background as diagnostic
}
当我第一次在具有已清除缓存的浏览器中运行此程序时,该窗体看起来与预期的完全一样,背景为亮绿色,如果我在框中输入文本,则该窗体将以30px大字体显示...但是,如果我之前使用过几次表格,那么浏览器似乎已经记住了之前的几个条目,即我在表格中已经看到一些以前输入的文本,如果我单击文本字段,则会看到一个列出了各种以前输入的菜单的菜单字符串。
我的问题是背景颜色和字体显然是由其他系统设置的,字体不是30号字体,背景不是绿色。不幸的是,我不知道是什么在控制字体样式。我在文档中找不到关于<input>
标签的任何内容。
答案 0 :(得分:1)
浏览器为方便起见,会为用户保存以前的输入值。但是,这根本不应该影响元素的样式。
请先检查您没有因某种原因而被覆盖的CSS。
!important
属性。您似乎也正在使用不必要的JavaScript来应用您的样式。为什么您按原样使用JavaScript有更深层的含义?您可以使用选择器来简单地使用普通的CSS解决方案。
作为最后的选择,您可以禁用自动完成功能,但这应该是您的最后选择,因为对于用户来说,提高生活质量是可行的。有多种方法可以做到这一点,最简单的方法是:
<input id="reg" type="text" name="reg" style="width: 200px;" class="eztext" autocomplete="off">
或者对于整个表格:
<form autocomplete="off" action="...">
有关禁用输入字段here的更多信息。
如果完全涉及输入字段本身的背景样式,则可以使用-webkit
CSS属性来获取所需的样式。
有关here的更多信息。
由@ Ramon de Vries在评论部分提供