这是自动完成的每个浏览器,除了Chrome。
我猜我必须专门针对Chrome。
有解决方案吗?
如果不是用CSS,那么用jQuery?
这是自动完成的每个浏览器,除了Chrome。
我猜我必须专门针对Chrome。
有解决方案吗?
如果不是用CSS,那么用jQuery?
当前回答
这是一个css的解决方案(目前,只适用于WebKit):
input:focus::-webkit-input-placeholder {
opacity: 0;
}
其他回答
<input
type="text"
placeholder="enter your text"
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'enter your text'" />
如果您的输入背景颜色是白色,那么您可以将占位符文本的颜色设置为焦点,以匹配输入背景-使文本不可见;从理论上讲。如果你的输入是不同的颜色,那么只需简单地改变颜色以匹配它。
input:focus::placeholder {
color: white;
}
此外,您可以将颜色设置为“透明”,如其他答案所示。
为了增强@casey-chu和pirate rob的回答,这里有一个更跨浏览器兼容的方法:
/* WebKit browsers */
input:focus::-webkit-input-placeholder { color:transparent; }
/* Mozilla Firefox 4 to 18 */
input:focus:-moz-placeholder { color:transparent; }
/* Mozilla Firefox 19+ */
input:focus::-moz-placeholder { color:transparent; }
/* Internet Explorer 10+ */
input:focus:-ms-input-placeholder { color:transparent; }
下面这段CSS对我来说很有用:
input:focus::-webkit-input-placeholder {
color:transparent;
}
对于一个纯基于CSS的解决方案:
input:focus::-webkit-input-placeholder {color:transparent;}
input:focus::-moz-placeholder {color:transparent;}
input:-moz-placeholder {color:transparent;}
注意: 尚未被所有浏览器供应商支持。
参考:Ilia Raiskin用CSS隐藏焦点上的占位符文本。