解决IE下textarea不识别maxlength属性的问题
首先先看一个比较简单的处理办法,代码如下:
$("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属性的问题相关推荐
- ios下多行文本输入框bug,textarea标签的maxlength属性在ios上计算
描述问题: textarea多行文本输入在ios上的bug 问题原因: textarea标签的maxlength属性在ios上计算有问题,ios的换行会占用两个字符.如下:ios换行(\n)其实是占用 ...
- 关于微信小程序textarea中的maxlength属性失效问题
关于微信小程序textarea中的maxlength属性失效问题 代码菜鸡今天在编写小程序前端代码时,遇到了一个问题:textarea输入140个字以后,就再也输不进去了,想着设置一下maxlengt ...
- pom文件报错_解决mac下tess4j文字识别报错问题
tesseract想必大家都知道(不知道自个查去),tess4j是java对tesseract的封装. Description: A Java JNA wrapper for Tesseract OC ...
- 解决mac下webstorm编辑器识别less的问题
之前在使用webstorm开发vue项目过程中,发现代码里的less有些地方总是飘红报错,虽然不影响整体代码运行,但是看起来总是很乱很难受,如下图(由于当时忘记截图,在网上找别人的图片,但是遇到问题是 ...
- 解决chrome下textarea控件滚动条不好使情况
若遇到chrome中textarea框滚动条不起作用,可添加style属性: style="resize:none;" chrome 默认是允许更改编辑框大小的,可取消这个特性,使 ...
- html 最大输入长度,TextArea设置MaxLength属性最大输入值的js代码
标准的DHTML文档中TEXTAREA的MAXLENGTH属性默认情况下不起作用,只有当事件发生时才起作用 如下:http://spiderscript.net/site/spiderscript/e ...
- 2013-01-09 13:31 IE不支持textarea的maxlength属性,Firefox支持
解决办法: <s:textarea name="doc.intro" id="intro" rows="3" cssStyle=&qu ...
- html中text的maxlength,详解maxlength属性在textarea里奇怪的表现
HTML5给表单带来了很多改变,比如今天要说的maxlength,这个属性可以限制输入框输入的最大字字符数,更方便的是对于粘贴的内容也能够根据字符数自动截断. 最近就接到这要一个需求,限制用户最多输入 ...
- 无法识别的属性“targetFramework”。请注意属性名称区分大小写的解决方法
一.错误详细情况 "/OA"应用程序中的服务器错误. 配置错误 说明:在处理向该请求提供服务所需的配置文件时出错.请检查下面的特定错误详细信息并适当地修改配置文件. 分析器错误消息 ...
最新文章
- rmi远程代码执行漏洞_【漏洞通告】Apache Solr远程代码执行漏洞
- Android线程详解
- ERROR 2384 — [ main] o.s.boot.SpringApplication : Application run failed
- 探探被安卓市场下架 官方回应:深入开展整改
- Java 8 特性 – 终极手册
- JAVA常用API或编程工具002---SpringSource Tool Suite:基于Eclipse的Spring应用开发环境
- Scala学习小小总结
- Security+ 学习笔记16 密钥管理
- 浅谈Tomcat接收到一个请求后在其内部的执行流程(源码)
- Python贴吧小爬虫
- 域外计算机无法连接远程桌面,如何开启域内计算机的远程桌面连接?
- java字符串hash算法_Java常用HASH算法总结【经典实例】
- 常见的计算机局域网络的拓扑结构是,局域网常见的拓扑结构有哪三种
- vue项目打包部署注意点 + 宝塔面板几步部署项目
- hexo博客的备份和迁移
- word计算机二级视频教程,计算机二级Office入门及上机实践视频教程之Word篇
- 差分约束 [HNOI2005]狡猾的商人(洛谷 P2294)
- 个人开源项目视频播放器~ERPlayer
- 用 Python 爬了点你们喜欢的电影
- 信息系统开发与管理【二】之 管理信息系统的基本知识
热门文章
- 【搞openssl,看这篇就够了!】openssl1.1.1g编译(windows linux)
- 【❌❌深入浅出,九浅一深⭕⭕】《深入理解计算机系统》CSAPP
- 深入理解pthread_cond_wait、pthread_cond_signal
- 操作系统(二十)进程互斥的硬件实现方法
- C语言再学习 -- 再论内存管理
- python中do的用法,如何使用docplex(python)对优化问题中的约束进行建模?
- EOS从入门到精通-设计背景与DPOS算法(文字稿)
- Android7.0 PowerManagerService(3) 核心函数updatePowerStateLocked的主要流程
- JZOJ 3418. 【NOIP动态规划专题】选课
- 卸料装置弹性零件的计算方法_冲裁模卸料板的设计