Html中输入框、文本框点击消失默认的字体

转:http://blog.sina.com.cn/s/blog_6d4bbf9b0100yp8n.html

Textarea 单击鼠标 清除默认字 点击文本域 默认内容消失 点击文本框 删除预置内容

在留言框、搜索栏或者Email订阅栏中有一段默认的文本,比如“请输入您的内容”,如果你在其中点击(窗体获取焦点),这段默认的文本就会自动消失。

1.添加代码方式:

<head>….

<script type=”text/javascript”>

function clearDefault(el) {if (el.defaultValue==el.value) el.value = “”   }

</script>

…</head>

2.如果是输入栏(Input),在其中添加一个onfocus参数,如:

<input type=”text” id=”input_email_address” name=”email” value=”Your Email Address” οnfοcus=”clearDefault(this)” />

3.如果是文本域,添加的onfocus参数如下:

<textarea name=”comment”  id=”input_comment” rows=”10″ οnfοcus=”this.value=’ ‘; this.οnfοcus=null;” >请输入您的内容</textarea>

不在<head>标签内添加上述相关代码,只在文本域添加了οnfοcus=”this.value=’ ‘; this.οnfοcus=null;”代码,貌似也正常的




文本框默认文字内容消失显示效果

平时常忽略对文本框的重视,做为一个合格的美工,不能因局部影响到整体,必须注重每个细节的处理,才能使页面更完美.

 

若初始值是非空的:   
  <TEXTAREA   οnmοuseοver="javascript:   if   (this.value=='移到文本域上方即可输入'){   this.value='';this.select();}"   wrap=VIRTUAL>移到文本域上方即可输入</TEXTAREA>   
  <input   type="text"   onMouseOver="javascript:   if   (this.value=='移到文本域上方即可输入'){   this.value='';this.select();}"   value="移到文本域上方即可输入">   

 

若初始值是空的,输入文字后移开鼠标,当再次移入输入框,它将自动选中之前的文字:     
  <textarea   class="input"   onMouseOver="this.focus();this.select()"></textarea>   
  <INPUT   name="Input"   class=input   οnmοuseοver=this.focus();this.select()   > 

 

移入输入框消失文字,离开输入框又显示文字

<INPUT TYPE="TEXT" size="18" value="这是默认的内容" οnfοcus="if (value =='这是默认的内容'){value =''}" οnblur="if (value ==''){value='这是默认的内容'}">

  • 3
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值