zoukankan      html  css  js  c++  java
  • 验证输入字数有最大值限制并且有提示还能输入多少

                   <div class="labelRight">
                        <input  onkeyup="WST.checkLength(this,'size01',15,1)" class="labelRight_tzName" type="text" name="tzName" value="{$obj['suitName']}">
                        <input type="hidden" name="suitId" id="suitId" value="{$obj['suitId']}">
                        <p>还能输入<span id="size01">15</span></p>
                    </div>

    js部分:

    WST.computeLength = function (eleInput, maxLength, nativeCharSize) {
        var nativeCharRegexp = /[u4E00-u9FFF]/;
        var string, char, length = 0;
        var ele = (typeof eleInput == 'string') ? document.getElementById(eleInput) : eleInput;
        if(maxLength == undefined) {
            maxLength = ele.maxLength || 100;
        }
    
        if(nativeCharSize == undefined) {
            nativeCharSize = 2;
        }
    
        string = (ele.value || '').split('');
    
        for(var i = 0, count = string.length; i < count; i ++) {
            char = string[i];
            if(nativeCharRegexp.test(char)) {
                length += nativeCharSize;
            } else {
                length ++;
            }
        }
    
        return length;
    }
    
    WST.checkLength = function (target,id,maxLength,zhiJie) {
        var maxLength = maxLength || 120; // 这是允许输入的最大数
        var zhiJie = zhiJie || 1; //这是区分字节的 例如汉字是2字节
        var targetLength = WST.computeLength(target, maxLength, zhiJie); // 这个是已输入的字符
        var leftLength =maxLength - targetLength;
        if(leftLength<=0){
            var val = $(target).val().slice(0,maxLength);
            $(target).val(val);
            document.getElementById(id).innerHTML = 0;
            $(target).keypress(function(event){
                var event = event || window.event;
                return false;
            });
        }else{
            document.getElementById(id).innerHTML = leftLength; // 这里的size就是需要变换数字地方的Id
        }
    }
  • 相关阅读:
    微软面试问题 情商测试
    SQL游标使用实例
    如何减小与“大牛”的差距
    Dotnet面试题
    排序算法对冒泡排序的优化改进算法
    一个SQL实现薪水大于所在部门平均薪水的员工
    ASP.NET中TextBox设置为Readonly后无法取值的解决办法
    jQuery.Autocomplete实现自动完成功能(详解)
    php发送get、post请求的几种方法
    ISO Latin1字符集
  • 原文地址:https://www.cnblogs.com/lst619247/p/8676543.html
Copyright © 2011-2022 走看看