1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>demo</title>
  6. </head>
  7. <body>
  8. <input id="text" placeHolder="最大支持12个字节" maxlength="" />
  9. <script type="text/javascript">
  10. var Str = {
  11. byteLen : function (str){
  12. //正则取到中文的个数,然后len*count+原来的长度。不用replace
  13. str += '';
  14. var tmp = str.match(/[^\x00-\xff]/g) || [];
  15. return str.length + tmp.length;
  16. },
  17. getMaxlen : function(str,maxlen){
  18. var sResult = '', L=, i=, stop = false, sChar;
  19. if(str.replace(/[^\x00-\xff]/g,'xxx').length <= maxlen){
  20. return str;
  21. }
  22. while(!stop){
  23. sChar = str.charAt(i);
  24. L+= sChar.match(/[^\x00-\xff]/) ? : ;
  25. if(L > maxlen){
  26. stop = true;
  27. }else{
  28. sResult+=sChar;
  29. i++;
  30. }
  31. }
  32. return sResult;
  33. }
  34. };
  35. var inputLock = false;
  36. document.querySelector('#text').addEventListener('compositionstart', function(){
  37. inputLock = true;
  38. })
  39. document.querySelector('#text').addEventListener('compositionend', function(){
  40. inputLock = false;
  41. var value = this.value,
  42. maxlength = this.getAttribute('maxlength');
  43. if(Str.byteLen(value) > maxlength){
  44. this.value = Str.getMaxlen(value, maxlength);
  45. }
  46. })
  47. document.querySelector('#text').addEventListener('input', function(){
  48. if(!inputLock){
  49. var value = this.value,
  50. maxlength = this.getAttribute('maxlength');
  51. if(Str.byteLen(value) > maxlength){
  52. this.value = Str.getMaxlen(value, maxlength);
  53. }
  54. }
  55. });
  56. </script>
  57. </body>
  58. </html>

input限制字符长度 - composition的更多相关文章

  1. jquery扩展实现input框字符长度限制中文2个字符,英文1个字符

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  2. jquery判断字符长度 数字英文算1字符 汉字算2字符

    <input type="text" maxlength="25" oninput="textlength(this)"> &l ...

  3. Jquery Validate自定义验证规则,一个汉字等于两个字符长度

    使用Jquery validate时写的一些东西,在这里做个笔记 在使用 Jquery validate 的minlength和maxlength进行文本框内容长度验证的时候,对于一个汉字的长度检测结 ...

  4. 动态SQL字符长度超过8000

    动态SQL字符长度超过8000,我记得SQL SERVER 2008中用SP_EXECUTESQL打破了这个限制. 平常用动态SQL,可能都会用EXEC(),但是有限制,就是8000字符串长度.自从S ...

  5. 解决MVC中JSON字符长度超出限制的异常

    解决MVC中JSON字符长度超出限制的异常 解决方法如下: <configuration> <system.web.extensions> <scripting> ...

  6. 【代码笔记】iOS-判断中英文混合的字符长度的两种方法

    一,代码. - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. ...

  7. 计算html标签textarea字符长度

    今天学习jQuery,做练习计算html标签textarea字符长度,先添加一个视图操作(Action): 创建一个视图,并按下面顺序标记1,2,3进行写html或javascript脚本: 其中标记 ...

  8. JavaScript判断字符串的字符长度(中文占两个字符)

    判断方法 //判断字符串中的字符 中文算两个字符 function chkstrlen(str) { ; ; i < str.length; i++) { ) //如果是汉字,则字符串长度加2 ...

  9. 每日学习心得:CustomValidator验证控件验证用户输入的字符长度、Linq 多字段分组统计、ASP.NET后台弹出confirm对话框,然后点击确定,执行一段代码

    2013-9-15 1.    CustomValidator验证控件验证用户输入的字符长度 在实际的开发中通常会遇到验证用户输入的字符长度的问题,通常的情况下,可以写一个js的脚本或者函数,在ASP ...

随机推荐

  1. bzoj 2015

    http://www.lydsy.com/JudgeOnline/problem.php?id=2015 裸最短路(' '     ) 不过我最初以为是mst (' '    ) #include & ...

  2. linux系统一些信息(待整理)

    Linux查看物理CPU个数.核数.逻辑CPU个数 复制代码 # 总核数 = 物理CPU个数 X 每颗物理CPU的核数 # 总逻辑CPU数 = 物理CPU个数 X 每颗物理CPU的核数 X 超线程数 ...

  3. tidb集群

    tidb ansible部署 https://zhuanlan.zhihu.com/p/27308307?refer=newsql 网址:http://www.cnblogs.com/mowei/p/ ...

  4. ZROI week4

    考试 前言 起晚了,大概10点才开始看T1,被别人问了T2有点懵逼. 和 这题看了就A掉了,感觉很像原题的样子,是我的错觉吗?? 串串 某神仙有个\(O(n)\)做法问了我一下,我当时也没怎么想(因为 ...

  5. php对接极光推送

    首先要明白php对接极光推送要做些什么,极光推送的大致流程是:你的服务器----->极光服务器------>app端.而php要做的就只有我们的服务器到极光服务器这个过程.极光服务器到ap ...

  6. 2019 pycharm激活码

    http://lookdiv.com 里面有,钥匙:1211268069 激活码网址里面有 lookdiv.com 里面的钥匙就是lookdiv.com

  7. 网神SecVSS 3600漏洞扫描系统

    网神SecVSS 3600漏洞扫描系统严格按照计算机信息系统安全的国家标准.相关行业标准设计.编写.制造.网神SecVSS 3600漏洞扫描系统可以对不同操作系统下的计算机(在可扫描IP范围内)进行漏 ...

  8. Ngrinder简单使用

    文章目录 安装 试玩 性能测试 安装 https://github.com/naver/ngrinder/releases 下载对应版本,是一个war包,3.4以上支持jdk1.8 将war包放到to ...

  9. 服务发现和注册和Eureka

    一 Spring Cloud特点 # 约定优于配置 # 开箱即用,快速启动 # 适用于各种环境,可以部署在PC server或者 云环境 # 轻量级的组件 # 组件的支持很丰富,功能齐全 # 选型中立 ...

  10. dubbo接口未更新,清maven缓存问题

    有时候idea maven reimport 并未更新到最新的版本 此时可以到./m2去进行手动清楚缓存再更新 cd .m2/repository/cn/dface/biz/couponcenter ...