最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
ie下textarea限制字数输入与光标移动问题
时间：2022-11-14 22:02:42 编辑：袖梨 来源：一聚教程网
最近做一个简单的字数限制碰到问题，就是使用jquery来限制textarea里面的字数的时候，碰到两个问题
1.用户输入的触发，比如退格，输入、粘贴，刚开始的时候绑定的是onkeyup onpaste 事件，但是体验就是不爽，用户使用拼音输入法的时候，拼写的字母也被keyup触发了，后来又发现了oninput事件，但是ie不支持，查了一下资料，原来ie全系列支持propertychange事件，于是首先判断用户的浏览器类型，然后决定绑定事件，问题解决。
2.在解决1的问题后，测试反映，ie系列下在用户输入一定字数后，光标就会跑到首尾，有时候甚至会把用户的输入全部干掉~ 可恶的ie，这个问题的解决是不要使用value，使用text即可
附加个bug,就是ie7的propertychange有bug，会不断地异步执行，然后抛出 stack overlimit的错误，所以加了一个syncProcessSign
还有截取字符串要考虑中文的情况
代码如下：
| 代码如下 | 复制代码 |
| function checkcontent(){ if($.syncProcessSign) return ; $.syncProcessSign = true; var desc = $("#papercontent").val(); var curLength=desc.realLength(); if(curLength >= 35) { $("#papercontent").val($("#papercontent").val().substring(0, 35));//此处最好换成您的中文截取方式 //$("#cannum").text(0);//可以显示字数 }else{ //$("#cannum").text(200-curLength);//可以显示字数 } $.syncProcessSign = false; } $(document).ready(function(){ if($.browser.msie&&$.browser.version!='9.0') //判断浏览器 { //ie浏览器 $('#papercontent').bind('propertychange', function() { var content = $("#papercontent").val(); var curLength=content.length; if(curLength > 35) { $(this).text($(this).text().substring(0, 35)); } //$("#cannum").text(140-curLength); //$("#nownum").text(curLength); }); }else{ //非ie浏览器 $('#papercontent').bind('input', function() { checkcontent(); }); } }); |
|