inupt textarea提示文字(点击消失,不输入恢复)及限制字数
效果:
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提示文字(点击消失,不输入恢复)及限制字数的更多相关文章
- HTML5轻松实现搜索框提示文字点击消失---及placeholder颜色的设置
在做搜索框的时候无意间发现html5的input里有个placeholder属性能轻松实现提示文字点击消失功能,之前还傻傻的在用js来实现类似功能... 示例 <form action=&quo ...
- inupt textarea提示文字(点击消失,不输入恢复)
<input name="textfield" type="text" maxlength="20" value="请输入 ...
- 设计input搜索框提示文字点击消失的效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- HTML 5 <input> placeholder 属性 实现搜索框提示文字点击输入后消失
H5之前要实现这个功能还要用到JS,H5出来之后新增加了placeholder属性,有了这个属性就就能轻松实现这个功能. 定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(h ...
- 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/ ...
- ECSHOP搜索框文字点击消失
<input name="keywords" type="text" id="keyword" value="黄山金银币&q ...
- textare限制拖动;提示文字(点击消失,不输入恢复提示信息)
1.在textarea添加一个样式:style="resize:none;" 2.提示文字(鼠标点击的时候消失,不输入恢复提示信息): <input name="t ...
- <textarea>输入框提示文字
背景 看了过时的资料,花费大把时间,不过也有收获,还是写写吧! 分析 有同学可能想到直接在<textarea>标签内输入帮助文字,但是这又有一个新问题--因为<textarea> ...
随机推荐
- Android 一个漂亮的Android日期和时间选择器:DateTimePicker
DateTimePicker这个类库包含了漂亮的 DatePicker 和 TimePicker ,类似于在新 Google Agenda App中看到的. 项目主页:http://www.open- ...
- kernel 模块与简单 hello 模块
Kernel 模块与简单 hello 模块 kernel 模块的简介 Linux 内核进行扩展时,例如编写驱动程序.netfilter功能等,最方便的方式是通过编写模块,然后加载到内核中.由于 ker ...
- ASP.NET Highcharts图表
js 图表代码,如下: charts[i] = new Highcharts.Chart({ chart: { backgroundColor: { linearGradient: [0, 0, 50 ...
- lib3ds类库
lib3ds类库 /* * The 3D Studio File Format Library * Copyright (C) 1996-2007 by Jan Eric Kyprianidis &l ...
- [QT]抄—影像显示实验
QtCreator新建一个Qt Application,命名为ImageView 在项目文件夹下添加gdal库,统一放在ImageView\gdal目录下. 右键单击项目,选择添加库命令,添加gdal ...
- os模块 关于路径问题使用
os.getcwd() 获取当前工作目录,即当前python脚本工作的目录路径 os.chdir("dirname") 改变当前脚本工作目录:相当于shell下cd os.curd ...
- nsstring打印结构体
// // main.m // 09-常用结构体 // // Created by apple on 14-3-20. // Copyright (c) 2014年 apple. All ri ...
- lua序列化(支持循环引用)
lua序列化 支持key类型为string, number 支持value类型为string, number, table, boolean 支持循环引用 支持加密序列化 支持loadstring反序 ...
- Java基础之线程——管理线程同步方法(BankOperation2)
控制台程序. 当两个或多个线程共享同一资源时,例如文件或内存块,就需要采取措施,确保其中的一个线程不会修改另一个线程正在使用的资源.当其中的一个线程更新文件中的某个记录,同时另一个线程正在检索这个记录 ...
- Java基础之读文件——使用通道读取混合数据2(ReadPrimesMixedData2)
控制台程序,本例读取Java基础之写文件部分(PrimesToFile2)写入的Primes.txt. 方法二:设置一个任意容量的.大小合适的字节缓冲区并且使用来自文件的字节进行填充.然后整理出缓冲区 ...