textarea 输入框限制字数
在textarea标签中,只需要设置maxlength=”***”即可,但是在textarea标签中,IE9及IE9以下浏览器是不支持的,IE10、IE11则支持,估计后续的版本应该都会支持。
现在来说下怎么让大部分IE版本都支持textarea 标签限制字数。
第一种方法:
<textarea id="taContent" rows="3" maxlength="20" onchange="this.value=this.value.substring(0, 20)" onkeydown="this.value=this.value.substring(0, 20)" onkeyup="this.value=this.value.substring(0, 20)" ></textarea>
这样子即可。
备注:onchange、onkeydown、onkeyu三者缺一不可。
如省略onchange,当你用负责功能,此时一直按着ctrl不松开,鼠标去点击其他地方(焦点移出textarea)时,不会自动取消超出部分;
如省略onkeydown,猛敲的时候会有很多个字符突然不见了;
如省略onkeyup,原想预计20的情况下,会变成21,并且最后一个字符是最后敲进去的。
Maxlength 也不可省略,加上maxlength 当碰到IE10及以上版本时,可以完美的实现限制输入框字数的功能。不想其他低版本的IE浏览器还可以出现一个字母后消失。
第二种方法:
<textarea onkeyup="checkLen(this)"></textarea>
<div>您还可以输入 <span id="count">3</span> 个文字</div>
<script type="text/javascript">
function checkLen(obj) {
var maxChars = 3;//最多字符数
if (obj.value.length > maxChars) obj.value = obj.value.substring(0,maxChars);
var curr = maxChars - obj.value.length;
document.getElementById("count").innerHTML = curr.toString();
}
</script>
以上两种方法都是兼容各大主浏览器的(包括IE6)。
textarea 输入框限制字数的更多相关文章
- textarea输入框限制字数(JS)
第一种: <textarea onkeyup="checkLen(this)"></textarea> <div>您还可以输入 <span ...
- jquery完美实现textarea输入框限制字数
<html> <head> <title> jquery完美实现textarea输入框限制字数</title> <meta http-equiv= ...
- textarea输入框限制字数
<textarea onkeyup="checkLen(this)"></textarea> <div>您还可以输入 <span id=& ...
- 仿校内textarea输入框字数限制效果
这是一个仿校内textarea回复消息输入框限制字数的效果,具体表现如下: 普通状态是一个输入框,当光标获取焦点时,出现字数记录和回复按钮 PS:上边那个小三角可不是用的图片. 普通状态效果如下: 获 ...
- 实现textarea限制输入字数(包含中文只能输入10个,全ASCII码能够输入20个)
document.getElementById("<%=textBox1.ClientID %>").value 实现textarea限制输入字数(包含中文只能输入10 ...
- TinyMCE textarea 输入框外部程序动态修改方法
TinyMCE textarea 输入框外部程序动态修改方法 Public Function C2IE_TINYMCE(ByVal id As String, ByVal value As Strin ...
- textarea还剩余字数统计
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title> ...
- HTML textarea输入框限制长度 (引)
引自:http://aqingsao.iteye.com/blog/398897 textarea在Web开发中经常用到,但是它本身不支持maxlength,可以通过下面的js实现: function ...
- 实现textarea限制输入字数
实现textarea限制输入字数(包含中文只能输入10个,全ASCII码能够输入20个) textarea称文本域,又称文本区,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到.与单行文本框t ...
随机推荐
- cassandra + lucene集成
Stratio’s Cassandra Lucene Index Stratio’s Cassandra Lucene Index, derived from Stratio Cassandra, i ...
- Dom0级事件
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- Spring事务传播机制详解
1 事务的传播属性(Propagation) 1) REQUIRED ,这个是默认的属性 Support a current transaction, create a new one if none ...
- 【IOS学习基础】NSObject.h学习
一.<NSObject>协议和代理模式 1.在NSObject.h头文件中,我们可以看到 // NSObject类是默认遵守<NSObject>协议的 @interface N ...
- 在Win7的IIS上搭建FTP服务及用户授权
FTP服务 FTP是文件传输协议(File Transfer Protocol)的简称,该协议属于应用层协议(端口号通常为21),用于Internet上的双向文件传输(即文件的上传和下载).在网络上有 ...
- Centos 配置ASP.Net Core 运行环境
一:ASP.Net Core跨平台运行,需要在Linux安装运行环境.本机器使用的Centos,下载安装地址为:https://www.microsoft.com/net/core#centos su ...
- Python 入门之常见小问题
1.在终端运行python,出现>>>即可输入代码回车进行执行,如果要退出,只需要执行exit()即可. -->在Python交互式命令行下,可以直接输入代码,然后执行,并立刻 ...
- canvas总结:线段宽度与像素边界
在canvas中,我们经常需要绘制线段,主要使用moveTo和lineTo两个方法,moveTo移动至线段起始点,lineTo将线段绘制至终点.同时,绘制线段时可以指定线段的宽度,使用lineWidt ...
- 我的DbHelper数据操作类(转)
其实,微软的企业库中有一个非常不错的数据操作类了.但是,不少公司(起码我遇到的几个...),对一些"封装"了些什么的东西不太敢用,虽然我推荐过微软的企业库框架了...但是还是要&q ...
- Javascript 多物体运动——逐行分析代码,让你轻松了解运动的原理
我们先来看下之前的运动的代码,是否支持多物体运动,会出现怎么样的问题. <style type="text/css"> div { width: 100px; heig ...