如题。前端页面的 input textarea 有时候须要显示默认文字以提示用户,下面为实现代码,以 input 为例。textarea 能够直接搬用

HTML

<input type="text" id="content" name="content" value="请输入内容"/>

CSS

<style type="text/css">
#content{color:#ccc; }
</style>

JavaScript

<script>
$("#content").focus(function(){
if(this.value == this.defaultValue) {
this.value='';
$(this).css('color','#000');
}
}); $("#content").blur(function(){
if(this.value == '') {
this.value=this.defaultValue;
$(this).css('color','#ccc');
}
});
});
</script>

End .

【前端JS】input textarea 默认文字,点击消失的更多相关文章

  1. input框内默认文字点击消失

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. HTML5轻松实现搜索框提示文字点击消失---及placeholder颜色的设置

    在做搜索框的时候无意间发现html5的input里有个placeholder属性能轻松实现提示文字点击消失功能,之前还傻傻的在用js来实现类似功能... 示例 <form action=&quo ...

  3. input输入框默认文字,点击消失

    <input type="text" value="请输入用户名" onfocus="if(value=='请输入用户名') {value='' ...

  4. input内文字点击消失 弹出层,可以写表单

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  5. 设计input搜索框提示文字点击消失的效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. textarea 默认文字获取焦点失去焦点

    <textarea name="textarea" cols="" title="contactForm" class="t ...

  7. js计算textarea输入文字的长度

    前言 日常开发过程中,有些时候我们想使用textarea,然后限制输入的长度,在textarea末尾显示剩余可输入的字节数. 如下图:  解决方法: 常用的有三种方法: 1.通过判断charCodeA ...

  8. ECSHOP搜索框文字点击消失

    <input name="keywords" type="text" id="keyword" value="黄山金银币&q ...

  9. 关于input/textarea提交内容空格回车转换问题,以及ng-model去除空格问题

    input/textarea提交内容空格回车转换问题 /*my-enter-bind.js*/ /*回车换行显示转义*/ 'use strict'; angular.module('app') .di ...

随机推荐

  1. HTTP,TCP,Socket

    TCP/IP三次握手和HTTP过程   1.TCP连接 手机能够使用联网功能是因为手机底层实现了TCP/IP协议,可以使手机终端通过无线网络建立TCP连接.TCP协议可以对上层网络提供接口,使上层网络 ...

  2. hibernate_validator_05

    校验约束 一,认识Validator---Validation中最主要的接口 1.怎么获取一个Validator--Validation.buildDefaultValidatorFactory() ...

  3. jQuery autoResize

    这是一个用jQuery实现的, 自动调整textarea高度, 非常的好!但原作者已经把它的相关描述页面移除了, 这里做个备份吧~但js路径还在:full: http://james.padolsey ...

  4. Asp.net的IP地址屏蔽功能设计

    "IP地址的长度为32位,分为4段,每段8位,用十进制数字表示,每段数字范围为0~255,段与段之间用句点隔开." 由此我们了解到,IP地址实际上是一个32位正整数,在C#中可以使 ...

  5. 疯狂学习java web2(css)

    CSS应该是样式描述的意思,定义如下: 什么是 CSS? CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 ...

  6. Phaser开源2d引擎 javascript/html5游戏框架

    功能特点(Features) 易维护代码(Easy Asset Loading) Phaser可以加载图片,音频文件,数据文件,文本文件和自动解析精灵图和纹理地图集数据(出口纹理封隔器或Flash C ...

  7. DOM&BOM笔记

    day01正课:1. DOM概述2. ***DOM树3. *查找 1. DOM概述: DHTML:动态网页技术的统称 DHTML=HTML+CSS+JS 鄙视题: HTML XHTML DHTML X ...

  8. 将Map转换为Java 对象

    public class MapUtil { public static Object convert2Object(Class clazz,Map<String,Object[]> ma ...

  9. Cracking the coding interview--Q2.3

    Implement an algorithm to delete a node in the middle of a singly linked list,given only access to t ...

  10. 移動電源ic的概述

    移動電源ic壹種集供電和充電功能於壹體的便攜式充電器,可以給手機等數碼設備隨時隨地充電或待機供電.壹般由鋰電芯或者幹電池作為儲電單元.區別於產品內部配置的電池,也叫外掛電池.壹般配備多種電源轉接頭, ...