首先先看一个比较简单的处理办法,代码如下:

  $("textarea[maxlength]").keyup(function () {var area = $(this);var max = parseInt(area.attr("maxlength"), 10); //获取maxlength的值if (max > 0) {if (area.val().length > max) { //textarea的文本长度大于maxlengtharea.val(area.val().substr(0, max)); //截断textarea的文本重新赋值
                }}});//复制的字符处理问题$("textarea[maxlength]").blur(function () {var area = $(this);var max = parseInt(area.attr("maxlength"), 10); //获取maxlength的值if (max > 0) {if (area.val().length > max) { //textarea的文本长度大于maxlengtharea.val(area.val().substr(0, max)); //截断textarea的文本重新赋值
                }}});

代码很简单,但是体验不太好,就是你会看到textarea里面字符已经输进去了,然后进行的字符截断,这种体验明显和input中设置maxlength属性的效果(体验)不一样,但也能凑合着用了。下面我们看较复杂的实现,下面这种实现所得到的体验效果就和input设置maxlength的一样了

function onmyinput(o, maxLength) {if (o.value.length >= maxLength) {if (o.value.length > maxLength) o.value = o.value.substring(0, maxLength);return false;}return true;
}
function mygetclipdata() {if (!document.all) {netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);trans.addDataFlavor('text/unicode');var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);clip.getData(trans, clip.kGlobalClipboard);var str = new Object();var strLength = new Object();trans.getTransferData("text/unicode", str, strLength);if (str) str = str.value.QueryInterface(Components.interfaces.nsISupportsString);var pastetext;if (str) pastetext = str.data.substring(0, strLength.value / 2);return pastetext;} else {return window.clipboardData.getData("Text");}
}
function mysetclipdata(o) {if (!document.all) {netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);trans.addDataFlavor("text/unicode");var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);str.data = o;trans.setTransferData("text/unicode", str, o.length * 2);var clipid = Components.interfaces.nsIClipboard;clip.setData(trans, null, clipid.kGlobalClipboard);} else {window.clipboardData.setData("Text", o);}
}
function onmypaste(o, maxLength) {var nMaxLen = o.getAttribute ? parseInt(maxLength) : "";if (!document.all) {//alert("不可能执行的代码");} else {if (document.selection.createRange().text.length > 0) {var ovalueandclipboarddata = o.value + window.clipboardData.getData("Text");if (o.getAttribute && ovalueandclipboarddata.length - document.selection.createRange().text.length > nMaxLen) {if (window.clipboardData.getData("Text").substring(0, document.selection.createRange().text.length + nMaxLen - o.value.length) != "") window.clipboardData.setData("Text", window.clipboardData.getData("Text").substring(0, document.selection.createRange().text.length + nMaxLen - o.value.length));else return false;}} else {var ovalueandclipboarddata = o.value + window.clipboardData.getData("Text");if (o.getAttribute && ovalueandclipboarddata.length > nMaxLen) {if (ovalueandclipboarddata.substring(0, nMaxLen - o.value.length) != "") window.clipboardData.setData("Text", ovalueandclipboarddata.substring(0, nMaxLen - o.value.length));else return false;}}return true;}
}
function onmykeypress(o, maxLength) {if (!document.all) {var nMaxLen = o.getAttribute ? parseInt(maxLength) : "";if (onmykeypress.caller.arguments[0].ctrlKey == true) {if (onmykeypress.caller.arguments[0].which == 118) {if (o.selectionStart < o.selectionEnd) {var ovalueandclipboarddata = o.value + mygetclipdata();if (o.getAttribute && (ovalueandclipboarddata.length - o.selectionEnd + o.selectionStart > nMaxLen)) {if (mygetclipdata().substring(0, o.selectionEnd - o.selectionStart + nMaxLen - o.value.length) != "") mysetclipdata(mygetclipdata().substring(0, o.selectionEnd - o.selectionStart + nMaxLen - o.value.length));else return false;}} else {var ovalueandclipboarddata = o.value + mygetclipdata();if (o.getAttribute && ovalueandclipboarddata.length > nMaxLen) {if (ovalueandclipboarddata.substring(0, nMaxLen - o.value.length) != "") mysetclipdata(ovalueandclipboarddata.substring(0, nMaxLen - o.value.length));else return false;}}return true;}}if (onmykeypress.caller.arguments[0].which == 0 || onmykeypress.caller.arguments[0].which == 8) return true;if (o.value.length >= maxLength) {if (o.selectionStart < o.selectionEnd) return true;if (o.value.length > maxLength) o.value = o.value.substring(0, maxLength);return false;} else return true;} else {if (document.selection.createRange().text.length > 0) return true;if (o.value.length >= maxLength) return false;else return true;}
}
window.onload = init_MaxLength;
function init_MaxLength() {var textAreaObj = document.getElementsByTagName("textarea");var maxLength;for (var i = 0; i < textAreaObj.length; i++) {maxLength = textAreaObj[i].getAttribute("maxLength") == null ? 0 : textAreaObj[i].getAttribute("maxLength");if (maxLength == 0) continue;textAreaObj[i].onpaste = function () {return onmypaste(this, maxLength)};textAreaObj[i].onkeypress = function () {return onmykeypress(this, maxLength)};textAreaObj[i].onpropertychange = function () {onmyinput(this, maxLength)};if (!document.all) {textAreaObj[i].setAttribute("oninput", "return onmyinput(this," + maxLength + ")");}}
}

转载于:https://www.cnblogs.com/laixiancai/p/4050364.html

解决IE下textarea不识别maxlength属性的问题相关推荐

  1. ios下多行文本输入框bug,textarea标签的maxlength属性在ios上计算

    描述问题: textarea多行文本输入在ios上的bug 问题原因: textarea标签的maxlength属性在ios上计算有问题,ios的换行会占用两个字符.如下:ios换行(\n)其实是占用 ...

  2. 关于微信小程序textarea中的maxlength属性失效问题

    关于微信小程序textarea中的maxlength属性失效问题 代码菜鸡今天在编写小程序前端代码时,遇到了一个问题:textarea输入140个字以后,就再也输不进去了,想着设置一下maxlengt ...

  3. pom文件报错_解决mac下tess4j文字识别报错问题

    tesseract想必大家都知道(不知道自个查去),tess4j是java对tesseract的封装. Description: A Java JNA wrapper for Tesseract OC ...

  4. 解决mac下webstorm编辑器识别less的问题

    之前在使用webstorm开发vue项目过程中,发现代码里的less有些地方总是飘红报错,虽然不影响整体代码运行,但是看起来总是很乱很难受,如下图(由于当时忘记截图,在网上找别人的图片,但是遇到问题是 ...

  5. 解决chrome下textarea控件滚动条不好使情况

    若遇到chrome中textarea框滚动条不起作用,可添加style属性: style="resize:none;" chrome 默认是允许更改编辑框大小的,可取消这个特性,使 ...

  6. html 最大输入长度,TextArea设置MaxLength属性最大输入值的js代码

    标准的DHTML文档中TEXTAREA的MAXLENGTH属性默认情况下不起作用,只有当事件发生时才起作用 如下:http://spiderscript.net/site/spiderscript/e ...

  7. 2013-01-09 13:31 IE不支持textarea的maxlength属性,Firefox支持

    解决办法: <s:textarea name="doc.intro" id="intro" rows="3" cssStyle=&qu ...

  8. html中text的maxlength,详解maxlength属性在textarea里奇怪的表现

    HTML5给表单带来了很多改变,比如今天要说的maxlength,这个属性可以限制输入框输入的最大字字符数,更方便的是对于粘贴的内容也能够根据字符数自动截断. 最近就接到这要一个需求,限制用户最多输入 ...

  9. 无法识别的属性“targetFramework”。请注意属性名称区分大小写的解决方法

    一.错误详细情况 "/OA"应用程序中的服务器错误. 配置错误 说明:在处理向该请求提供服务所需的配置文件时出错.请检查下面的特定错误详细信息并适当地修改配置文件. 分析器错误消息 ...

最新文章

  1. rmi远程代码执行漏洞_【漏洞通告】Apache Solr远程代码执行漏洞
  2. Android线程详解
  3. ERROR 2384 — [ main] o.s.boot.SpringApplication : Application run failed
  4. 探探被安卓市场下架 官方回应:深入开展整改
  5. Java 8 特性 – 终极手册
  6. JAVA常用API或编程工具002---SpringSource Tool Suite:基于Eclipse的Spring应用开发环境
  7. Scala学习小小总结
  8. Security+ 学习笔记16 密钥管理
  9. 浅谈Tomcat接收到一个请求后在其内部的执行流程(源码)
  10. Python贴吧小爬虫
  11. 域外计算机无法连接远程桌面,如何开启域内计算机的远程桌面连接?
  12. java字符串hash算法_Java常用HASH算法总结【经典实例】
  13. 常见的计算机局域网络的拓扑结构是,局域网常见的拓扑结构有哪三种
  14. vue项目打包部署注意点 + 宝塔面板几步部署项目
  15. hexo博客的备份和迁移
  16. word计算机二级视频教程,计算机二级Office入门及上机实践视频教程之Word篇
  17. 差分约束 [HNOI2005]狡猾的商人(洛谷 P2294)
  18. 个人开源项目视频播放器~ERPlayer
  19. 用 Python 爬了点你们喜欢的电影
  20. 信息系统开发与管理【二】之 管理信息系统的基本知识

热门文章

  1. 【搞openssl,看这篇就够了!】openssl1.1.1g编译(windows linux)
  2. 【❌❌深入浅出,九浅一深⭕⭕】《深入理解计算机系统》CSAPP
  3. 深入理解pthread_cond_wait、pthread_cond_signal
  4. 操作系统(二十)进程互斥的硬件实现方法
  5. C语言再学习 -- 再论内存管理
  6. python中do的用法,如何使用docplex(python)对优化问题中的约束进行建模?
  7. EOS从入门到精通-设计背景与DPOS算法(文字稿)
  8. Android7.0 PowerManagerService(3) 核心函数updatePowerStateLocked的主要流程
  9. JZOJ 3418. 【NOIP动态规划专题】选课
  10. 卸料装置弹性零件的计算方法_冲裁模卸料板的设计