• textArea用页面加载函数中写限制超过长度的代码


     最近公司要求做一个限制用户输入的字数在规定字数内,并给出友好的提示.

     因为不能给textArea文本域绑定函数,必须在一个日历加载的js中完成这些逻辑,所以我就选择在页面绑定函数中完成这个功能.

                   <textarea class="content" id="txt" maxcodelength="10"></textarea><div class="wenben">剩余<font color=red>10</font></div>

    下面是页面绑定函数中写的逻辑

    $(document).bind('propertychange input', function () {
                    //验证所有英文数字和英文字符
                    var reEnglish = /^[0-9a-zA-Zx21-x2fx3a-x40x5b-x60x7B-x7F]+$/;
                    var content = $('#txt').val();
                    var limitLen = 10;
                    $('#txt').attr("maxlength", limitLen);
                    var chinese = 0;
                    var other = 0;
                     setTimeout(function() {
                         for (var i = 0; i < content.length; i++) {
                             var inputContent = content.charAt(i);
                             if (reEnglish.test(inputContent)) {
                                 limitLen = limitLen - 1;
                                 other++;
                             } else {
                                 limitLen = limitLen - 3;
                                 chinese++;
                             }
                         }
                         if (limitLen >= 0) {
                             $('.wenben font').text(limitLen);
                         } else {
                             alert("超过字数限制!");
                             var finalLen = Math.floor(other + (10 - other)/3);
                             content = content.substring(0, finalLen);
                             var a = 0;
                             var b = 0;
                             for(var j=0;j<content.length;j++){
                                 if(reEnglish.test(content[j])) {
                                     a ++;
                                }else {
                                     b ++;
                                }
                             }
                             var editLength = 10-a*1-b*3;
                             $('#txt').attr("maxlength", content.length+editLength);
                             $('#txt').val(content);
                             $('.wenben font').text(editLength);
                         }
                     },0);
                });
  • 相关阅读:
    Docker
    Alfred Workflow
    AWS Lambda
    XPath
    WebMagic
    Splash
    Selenium
    代理服务器
    JSONPath
    Sqlserver 查询分组 记录
  • 原文地址:https://www.cnblogs.com/learnjfm/p/8033605.html
Copyright © 2020-2023  润新知