textarea中限制输入字符长度
要在textarea中限制输入字符的长度,比如在twitter中要限制字符为140个,可实现的方法有:
1.
<textarea name="A" cols="45" rows="2" onKeyDown='if (this.value.length>=20){event.returnValue=false}'>aaaa</textarea>
2. 我们也可以将判断写在函数中,如果输入的长度超过显示,就显示提示信息,如下:
<form name =
"testform">
<textarea name="A" cols="45" rows="2"
>aaaa</textarea>
<input type="button" onclick =
"checkValid()" value= "提交">
</form>
<script
language="javascript">
function checkValid()
{
var a =
document.testform.A;
if(a.value.length > 20)
{
alert("输入的备注框长度不能超过20个字符!");
return false;
}
return true;
}
3. 上述两种方法无法判断如果使用copy后的准确字数,可以使用onpropertychange属性。
onpropertychange可以用来判断预定元素的value值,当元素的value值发生变化时判断事件就会被触发,仅关心被监测元素的
value值,避开了输入的来源,从而可以比较理想地达成我们的限制字数这一目的。它属于JS范畴,可以在表单方框区代表中嵌套使用,以下是代码和效果样式,可以像上面那样测试输入,你会发现它真正达到目的:不管用什么方式输入,它只能输入100个字(汉字或其他小解符号):
代码:
<textarea onpropertychange="if(value.length>100)
value=value.substr(0,100)" class="smallArea" cols="60" name="txta"
rows="8"></textarea>
4. 在<textarea>的onKeyup,onKeyDown和onPaste事件中调用js方法,例:
<tr align="center">
还可以输入<span
id="validNum">140</span>字</td>
</tr>
<tr align="center">
<td>
<textarea name="talkTopic" id="talkTopic" rows=4 cols="50" maxlength='140'
onKeyDown="checkLength()"
onKeyUp="checkLength()"
onPaste="checkLength()"></textarea>
</td>
</tr>
function checkLength(){
var value =
document.getElementById("talkTopic").value;
if(value.length>140){
document.getElementById("talkTopic").value=document.getElementById("talkTopic").value.substr(0,
140);
}else{
document.getElementById("validNum").innerHTML = 140 - value.length;
}
}
在checkLength()中,验证textarea的长度,如果超过了限制的长度,则取前140个字符。
textarea中限制输入字符长度的更多相关文章
- textarea中限制输入字符长度(实用版)
textarea称文本域,又称文本区,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到.与单行文本框text控件不同,它不能通过maxlength属性来限制字数,为此必须寻求其他方法来加以限制 ...
- jQuery实现限制input框 textarea文本框输入字符数量的方法
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- elementUi中input输入字符光标在输入一个字符后,光标失去焦点
elementUi中input输入字符光标在输入一个字符后,光标就退出,无法输入需要再次聚焦然后输入一个字符又再次退出 首先,用elementUi正常用v-model绑定输入的值是不会造成光标退出的, ...
- vue 限制输入字符长度
一.watch方法: <input v-model="textareaValue" type="textarea" placeholder="请 ...
- summernote 富文本编辑器限制输入字符长度
项目中需要一个比较简单的富文本编辑器,于是选中了summernote .虽然比较轻量,但是在开发中也遇到了几个问题,在此记录一下. 1:样式和bootstrap冲突,初始化之后显示为: .note-e ...
- BeyondCompare两个文件中同一行字符长度不一致的文件对比,比如pi文件对比(xjl456852原创)
假设有两个文件,里面存放的数字都只有一行,但长度不一样,对比时会有问题 示例文件: 对比示例如图: 左边的pi的字符串比较长,右边的比较短. 右边的pi的值不是从开始的第一个位置对比的,这样的情况是有 ...
- iOS 学习 - 7.限制 TextField 输入字符长度
#pragma mark -- TextField代理 -(BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange: ...
- as3中textField输入字符时,一次性过长后自动换行
txt_show.text = showStr; var str:String = txt_show.text; var strlen:int = str.length; var len:int = ...
- textarea中的文字自动换行问题
在textarea中设置输入内容的自动换行,也是在CSS中设置word-wrap:break-word; 属性.需要额外注意的是textarea元素本身有一个warp属性,其取值含义如下: off:不 ...
随机推荐
- ContentProvider深度探索
如果你选择用SQLite数据库存储应用程序数据,我建议你创建ContentProvider,即使存储的数据仅供内部使用.原因是Android提供了一些工具类以及UI相关的类,它们的工作在Content ...
- PHP学习笔记 - 进阶篇(8)
PHP学习笔记 - 进阶篇(8) 日期与时间 取得当前的Unix时间戳 UNIX 时间戳(英文叫做:timestamp)是 PHP 中关于时间与日期的一个很重要的概念,它表示从 1970年1月1日 0 ...
- C#编写以管理员身份运行的程序
using System; using System.Collections.Generic; using System.Linq; using System.Windows.Forms; names ...
- (转)ASP.NET并发处理
对于DB服务器同样也可以调整最大连接数来做优化. 在调整优化好最大连接数之后,就只有软硬件负载均衡了.硬件负载均衡能够直接通过智能交换机实现,处理能力强,而且与系统无关,但是价格贵,配置困难,不能区分 ...
- Linux 查看系统版本及位数
1. 查看内核版本命令: 1) [root@www ~]# cat /proc/version Linux version 2.6.9-22.ELsmp (bhcompile@crowe.dev ...
- sass最佳实践
sass 变量 可以实现统一的布局,比如统一的内边距,统一的外边距,统一的颜色,统一的字号. 嵌套 可以根据组件的嵌套方式来嵌套css代码,方便收缩,查找.代码结构非常清晰,有利于以组件的方式开发 混 ...
- Linux ed
ed 编辑器是 Linux 操作系统下最简单的文本编辑器.它是以行为单位对文件进行编辑的编辑器,而不像 MS-DOS 系统下的 edit 那样是以整个屏幕框架为单位对文件进行编辑的.因此,如果你已经习 ...
- Memcached的安装(Linux)、操作、命令
最近在整理有关分布式缓存的服务器,做了一下老牌nosql服务器memcached的学习总结.文中所述的所有安装均是在联网的情况下进行的. 序: 什么是memcached: Free & ope ...
- 获取客户端访问的ip地址
function real_ip() { static $realip = NULL; if ($realip !== NULL) { return $realip; } if (isset($_SE ...
- 使用VS时点右键卡住—不响应的问题
以前因为论坛,后来因为工作,发现已经好久没有来百度空间了.也好久没人留言或发表评论了,今天自己更新一下吧. 关于使用VS时点右键卡住或不响应的问题,我是在VS 2008中遇到的,不知道其它的版本有没有 ...