效果:

input:

textarea: 限100字

源码:

input:
<input name="textfield" type="text" maxlength="20" value="请输入文字.."
onfocus="if (value =='请输入文字..'){value =''}"
onblur="if (value ==''){value='请输入文字..'}" />
<br><br>
textarea:
<textarea cols="50" rows="5" id="textarea" onKeyDown="textdown(event)"
onKeyUp="textup()" onfocus="if(value=='限100字'){value=''}"
onblur="if (value ==''){value='限100字'}">限100字</textarea> <SCRIPT type="text/javascript">
function textdown(e) {
textevent = e;
if (textevent.keyCode == 8) {
return;
}
if (document.getElementById('textarea').value.length >= 100) {
alert("大侠,手下留情,此处限字100")
if (!document.all) {
textevent.preventDefault();
} else {
textevent.returnValue = false;
}
}
}
function textup() {
var s = document.getElementById('textarea').value;
//判断ID为text的文本区域字数是否超过100个
if (s.length > 100) {
document.getElementById('textarea').value = s.substring(0, 100);
}
}
</SCRIPT>

inupt textarea提示文字(点击消失,不输入恢复)及限制字数的更多相关文章

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

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

  2. inupt textarea提示文字(点击消失,不输入恢复)

    <input name="textfield" type="text"  maxlength="20" value="请输入 ...

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

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

  4. HTML 5 <input> placeholder 属性 实现搜索框提示文字点击输入后消失

    H5之前要实现这个功能还要用到JS,H5出来之后新增加了placeholder属性,有了这个属性就就能轻松实现这个功能. 定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(h ...

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

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

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

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

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

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

  8. textare限制拖动;提示文字(点击消失,不输入恢复提示信息)

    1.在textarea添加一个样式:style="resize:none;" 2.提示文字(鼠标点击的时候消失,不输入恢复提示信息): <input name="t ...

  9. <textarea>输入框提示文字

    背景 看了过时的资料,花费大把时间,不过也有收获,还是写写吧! 分析 有同学可能想到直接在<textarea>标签内输入帮助文字,但是这又有一个新问题--因为<textarea> ...

随机推荐

  1. [BS-01] 根据字符串对象的参数自动计算用来显示该字符串的UI控件的宽和高

    根据字符串对象的参数自动计算用来显示该字符串的UI控件的宽和高 1.  影响昵称Label的高和宽的因素: 字体和字号大小.文字多少.高度取决于是否固定了宽度(是否限制了最大的宽度和高度) 2. 使用 ...

  2. Intellij IDEA 创建控制台项目,断点调试

    在idea 2016中创建一个控制台项目(经常会忘) 打开创建界面 注意,什么都不要选,点击next(最坑的地方,经常忘) 再次点击next ============================= ...

  3. SocketServer model_use

    #!/usr/bin/env python #-*- coding:utf- -*- import SocketServer class MySocker(SocketServer.BaseReque ...

  4. C# SQL优化 及 Linq 分页

    每次写博客,第一句话都是这样的:程序员很苦逼,除了会写程序,还得会写博客!当然,希望将来的一天,某位老板看到此博客,给你的程序员职工加点薪资吧!因为程序员的世界除了苦逼就是沉默.我眼中的程序员大多都不 ...

  5. Struts2 用 s:if test 判断属性和字符串相等时 注意双引号和单引号的使用

    字符串N一定要用“”双引号包含,从test的包含则用单引号 ‘ ’,如果相反,则不能正确判断该属性是否与该字符串相等. 正确:<s:if test='activityBean.searchFor ...

  6. G面经prepare: Data Stream Average

    给一个datastream和一个fixed window size, 让我design一个class可以完成add number还有find average in the window. 就是不能用v ...

  7. JAVA-面向对象-继承

    继承   (关键字extends   ) (关键字 final 表示终态,在父类前加 final 则父类无法被继承,加在方法前则方法不能被重写或者覆盖,加在变量前则变量只能被赋值一次) 1.权限修饰符 ...

  8. ADO.net 实体类 、数据访问类

    程序分三层:界面层.业务逻辑层.数据访问层 比较规范的写程序方法,要把业务逻辑层和数据访问层分开,此时需要创建实体类和数据访问类 实体类: 例 using System; using System.C ...

  9. js eventhandler

    1.获取所有eventhandler 使用 getEventHandler(target) 2.target.addEventHandler(type,handler,userCapture?) 3. ...

  10. ACRush 楼天成回忆录

    楼教主回忆录: 利用假期空闲之时,将这几年 GCJ , ACM , TopCoder 参加的一些重要比赛作个回顾.首先是 GCJ2006 的回忆. Google Code Jam 2006 一波三折: ...