这是自动完成的每个浏览器,除了Chrome。
我猜我必须专门针对Chrome。
有解决方案吗?
如果不是用CSS,那么用jQuery?
这是自动完成的每个浏览器,除了Chrome。
我猜我必须专门针对Chrome。
有解决方案吗?
如果不是用CSS,那么用jQuery?
当前回答
除此之外,我有两个想法。
您可以添加一个模仿palceholder的元素。然后使用javascript控制元素的显示和隐藏。
但它太复杂了,另一个是用兄弟的css选择器。就像这样:
.占位符{位置:绝对;字体大小:14 px;左:40像素;上图:11 px;行高:1;pointer-events:没有;} .send消息输入:焦点+ .占位符{显示:无;}
23333,我的英语很差。希望能解决你的问题。
其他回答
2018 > JQUERY v3.3解决方案: 工作全局为所有输入,文本区域与占位符。
$(function(){
$('input, textarea').on('focus', function(){
if($(this).attr('placeholder')){
window.oldph = $(this).attr('placeholder');
$(this).attr('placeholder', ' ');
};
});
$('input, textarea').on('blur', function(){
if($(this).attr('placeholder')){
$(this).attr('placeholder', window.oldph);
};
});
});
为了增强@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; }
和我在angular 5中应用的一样。
我创建了一个新的字符串来存储占位符
newPlaceholder:string;
然后我在输入框上使用了焦点和模糊函数(我使用的是素数ng自动完成)。
上面的占位符是从typescript中设置的
我用的两个函数是-
/* Event fired on focus to textbox*/
Focus(data) {
this.newPlaceholder = data.target.placeholder;
this.placeholder = '';
}
/* Event fired on mouse out*/
Blur(data) {
this.placeholder = this.newPlaceholder;
}
除此之外,我有两个想法。
您可以添加一个模仿palceholder的元素。然后使用javascript控制元素的显示和隐藏。
但它太复杂了,另一个是用兄弟的css选择器。就像这样:
.占位符{位置:绝对;字体大小:14 px;左:40像素;上图:11 px;行高:1;pointer-events:没有;} .send消息输入:焦点+ .占位符{显示:无;}
23333,我的英语很差。希望能解决你的问题。
如果您的输入背景颜色是白色,那么您可以将占位符文本的颜色设置为焦点,以匹配输入背景-使文本不可见;从理论上讲。如果你的输入是不同的颜色,那么只需简单地改变颜色以匹配它。
input:focus::placeholder {
color: white;
}
此外,您可以将颜色设置为“透明”,如其他答案所示。