Question

我想更改文本框内图像的可见性。当我选择文本框“搜索”时，占位符变为不可见。你可以用里面的图片做同样的事情吗？

代码：

<div id="ricerca">
                  <form >
                  <input type="text" class="ricerca" value="Search" onblur="if (this.value == '') this.value ='Search';" onclick="if (this.value == 'Search') this.value ='';"  >
                  <input type="submit"  id="lente" class="lente"  value="show" style="border:none;">
                  </form> 
</div>

这是链接：http://www.lookcommunication.it/korus/WEPA/IT/

Answer 1

这适用于你＆gt;

<style type="text/css">
input.image-placeholder{
    background-image:url("image path");
    background-repeat:no-repeat;
    background-position: center left;
}
</style>

<div id="ricerca">
              <form >
              <input type="text" class="ricerca" value="Search" onblur="if (this.value == '') this.className= this.className + ' image-placeholder';" onclick="if (this.value == 'Search') this.className='ricerca';"  >
              <input type="submit"  id="lente" class="lente"  value="show" style="border:none;">
              </form> 
</div>

Answer 2

为您提供一些Jquery功能

$(".ricerca").click(function() {
  $("#lente").hide();
 });
$(".ricerca").focusout(function() {
  $("#lente").show();
  $("#lente").css('marginTop',"-22px");
 });

在这里查看JSFIDDLE DEMO

选中时，在文本框中使用javascript隐藏图像

2 个答案: