1. 云栖社区>
  2. >
  3. 正文

JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法_javascript技巧

作者:用户 来源:互联网 时间:2016-07-01 13:47:30

javascript背景图片文本框消失获得焦点

JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法_javascript技巧 - 摘要: 本文讲的是JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法_javascript技巧, 本文实例讲述了JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法。分享给大家供大家参考。具体如下: html代码: <form name="searchform" id="search-form">

本文实例讲述了JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法。分享给大家供大家参考。具体如下:

html代码:

<form name="searchform" id="search-form">
  <div>
    <b>Search</b>
    <input type="text" name="txtInput" 
    title="Enter the terms you wish to search for." />
    <input type="submit" value="GO!" class="submit"
    style="cursor: pointer;" />
  </div>
</form>

JS代码:

<script type="text/javascript" language="javascript">
 (function() {
  var id = document.getElementById('search-form');
  if (id && id.txtInput) {
   var name = id.txtInput;
   var unclicked = function() {
     if (name.value == '') {
       name.style.background = '#FFFFFF url(images/googbg.png) left no-repeat';
     }
    };
    var clicked = function() {
     name.style.background = '#ffffff';
    };
  name.onfocus = clicked;
  name.onblur = unclicked;
  unclicked();
  }
 })();
</script>

希望本文所述对大家的javascript程序设计有所帮助。

以上是云栖社区小编为您精心准备的的内容,在云栖社区的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索javascript , 背景图片 , 文本框 , 消失 获得焦点 javascript文本框赋值、javascript清空文本框、javascript 文本框、文本框失去焦点事件、文本框获得焦点,以便于您获取更多的相关知识。