如题。前端页面的 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. 创建DBLink语句

    --linkName DBLink名 --username 用户名 --password 密码 --tns TNS配置字符串 create database link &linkName co ...

  2. Hibernate 性能优化之一级缓存

     1.一级缓存的生命周期     一级缓存在session中存放,只要打开session,一级缓存就存在了,当session关闭的时候,一级缓存就不存在了   2.一级缓存是依赖于谁存在的      ...

  3. 使用C++11 实现的线程池

    最近打算做一个服务器端程序,每来一个客户端请求新开一个线程进行处理.在网上查了一些资料后,准备使用线程池来做这个东西.使用C++11新的库处理想线程问题比以前简单了许多,在网上找到一份线程池的实现,h ...

  4. POJ 1155 树形背包(DP) TELE

    题目链接:  POJ 1155 TELE 分析:  用dp[i][j]表示在结点i下最j个用户公司的收益, 做为背包处理.        dp[cnt][i+j] = max( dp[cnt][i+j ...

  5. jQuery实现按Enter键触发事件?

    按Enter触发 $(function(){ document.onkeydown = function(e){ var ev = document.all ? window.event : e; ) ...

  6. Json处理函数json_encode json_decode

    json_decode — 对 JSON 格式的字符串进行编码 mixed json_decode ( string $json [, bool $assoc = false [, int $dept ...

  7. get_magic_quotes_gpc() 内置函数

    get_magic_quotes_gpc()函数 在PHP中是内置的函数,这个函数的作用就是得到php.ini设置中magic_quotes_gpc选项的值. 当magic_quotes_gpc=On ...

  8. PHP图形计算器(计算三角形矩形周长面积)

    运用PHP面向对象的知识设计一个图形计算器,同时也运用到了抽象类知识,这个计算器可以计算三角形的周长和面积以及矩形的周长和面积.本图形计算器有4个页面:1.PHP图形计算器主页index.php;   ...

  9. C51 库函数(1)

    C-51软件包的库包含标准的应用程序,每个函数都在相应的头文件(.h)中有原型声明.如果使用库函数,必须在源程序中用预编译指令定义与该函数相关的头文件(包含了该函数的原型声明).例如: #includ ...

  10. JNA入门实例

    JNA(Java Native Access):建立在JNI之上的Java开源框架,SUN主导开发,用来调用C.C++代码,尤其是底层库文件(windows中叫dll文件,linux下是so[shar ...