【前端JS】input textarea 默认文字,点击消失
如题。前端页面的 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 默认文字,点击消失的更多相关文章
- input框内默认文字点击消失
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- HTML5轻松实现搜索框提示文字点击消失---及placeholder颜色的设置
在做搜索框的时候无意间发现html5的input里有个placeholder属性能轻松实现提示文字点击消失功能,之前还傻傻的在用js来实现类似功能... 示例 <form action=&quo ...
- input输入框默认文字,点击消失
<input type="text" value="请输入用户名" onfocus="if(value=='请输入用户名') {value='' ...
- input内文字点击消失 弹出层,可以写表单
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- 设计input搜索框提示文字点击消失的效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- textarea 默认文字获取焦点失去焦点
<textarea name="textarea" cols="" title="contactForm" class="t ...
- js计算textarea输入文字的长度
前言 日常开发过程中,有些时候我们想使用textarea,然后限制输入的长度,在textarea末尾显示剩余可输入的字节数. 如下图: 解决方法: 常用的有三种方法: 1.通过判断charCodeA ...
- ECSHOP搜索框文字点击消失
<input name="keywords" type="text" id="keyword" value="黄山金银币&q ...
- 关于input/textarea提交内容空格回车转换问题,以及ng-model去除空格问题
input/textarea提交内容空格回车转换问题 /*my-enter-bind.js*/ /*回车换行显示转义*/ 'use strict'; angular.module('app') .di ...
随机推荐
- 在eclipse中新建Dynamic web project时选择2.5和3.0的区别(里面涉及servlet和tomcat的问题)
1.是指servlet的版本,是2.5的还是3.0的 servlet3.0以后支持异步 2.dynamic web module和对应的TOMCAT 版本 http://blog.sina.com.c ...
- 015_xml_函数
015_xml_函数 --环境准备******************************************************************* USE test --f:/t ...
- 3DMAX-模型制作简介
本文由博主(YinaPan)原创,转载请注明出处:http://www.cnblogs.com/YinaPan/p/3dmax_moxingzhizuo.html 一.快捷键: ALT + X 透明 ...
- ASP.NET MVC中的模型绑定
模型绑定的本质 任何控制器方法的执行都受action invoker组件(下文用invoker代替)控制.对于每个Action方法的参数,这个invoker组件都会获取一个Model Binder ...
- Zsh安装CMake补全脚本进行CMake命令补全
最近在尝试使用Zsh,发现其补全命令的功能相当厉害.但对CMake命令的补全在默认的5.0.5中好像没有看到,网上找了下关于配置Zsh补全的文章也没有多少. 于是自己动手,发现在Zsh安装目录 ...
- C++ Primer 5th 第12章 动态内存
练习12.1:在此代码的结尾,b1 和 b2 各包含多少个元素? StrBlob b1; { StrBlob b2 = {"a", "an", "th ...
- [前端笔记]第一篇:html
什么是 HTML? HTML 是用来描述网页的一种语言.HTML 指的是超文本标记语言 (Hyper Text Markup Language)HTML 不是一种编程语言,而是一种标记语言 (mark ...
- linux c数据库备份第二版
#想知道更多请查看第一版"linux c数据库备份第一版" #include<sys/types.h> #include<sys/wait.h> #incl ...
- Color the ball
hdu1556:http://acm.hdu.edu.cn/showproblem.php?pid=1556 题意:中文题. 题解:这一题当然可以直接用线段树来打,但是最近在学树状数组,所以用树状数组 ...
- Web分析日志
http://www.docin.com/p-649515490.html http://wenku.baidu.com/link?url=kB-83fbl1Zc3Y6U2BYLj-lKMWShe8Z ...