使输入字段背景图像在输入文本后消失 [英] Make input field background image disappear after text is inputted

问题描述

我想让输入框的背景图片消失，一旦用户输入了任何数量的文字。在javascript中有一个简单的方法来做到这一点？我可以得到它，所以bg消失，而字段集中，但然后一旦返回一旦他们移动到下一个字段。

I'd like to make the background image for my input field disappear once the user has typed any amount of text in it. Is there a simple way to do that in javascript? I can get it so the bg disappears while the field is focused, but then it returns once they move on to the next field.

HTML：

致电< input name =phonetype =textclass =phone-fieldid =phone>

CSS：

HTML:
Call me at <input name="phone" type="text" class="phone-field" id="phone">
CSS:

.form input {
  background-color:transparent;
}
.form input:focus {
  background-color:#edc;
  background-image:none;
}
input.phone-field {
  background-image: (url/images/phonebg.png);
  background-repeat: no-repeat;
  background-position: left 1px;
}

推荐答案

像

 $('#phone').focus(function(){
     var text = $(this).val();   
     if(text != ''){
        $(this).css('background-image', 'none');       
     }
 });

这篇关于使输入字段背景图像在输入文本后消失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！