随笔 - 83,  文章 - 6,  评论 - 20,  阅读 - 10万

js判断输入字符串长度(汉字算两个字符,字母数字算一个)

文本输入时,由于数据库表字段长度限制会导致提交失败,因此想到了此方法验证。

废话不多说上代码:

复制代码
<html>
<head>
    <title>js判断输入字符串长度(汉字算两个字符,字母数字算一个)</title>
    <style type="text/css">
        .pbt {
            margin-bottom: 10px;
        }

        .ie6 .pbt .ftid a, .ie7 .pbt .ftid a {
            margin-top: 1px;
        }

        .cl:after {
            clear: both;
            content: ".";
            display: block;
            height: 0;
            visibility: hidden;
        }
    </style>
    <script type="text/javascript">
        //获取字符串长度(汉字算两个字符,字母数字算一个)
        function getByteLen(val) {
            var len = 0;
            for (var i = 0; i < val.length; i++) {
                var a = val.charAt(i);
                if (a.match(/[^\x00-\xff]/ig) != null) {
                    len += 2;
                }
                else {
                    len += 1;
                }
            }
            return len;
        }
        // 只要键盘一抬起就验证编辑框中的文字长度,最大字符长度可以根据需要设定
        function checkLength(obj) {
            var maxChars = 80;//最多字符数     
            var curr = maxChars - getByteLen(obj.value);
            if (curr > 0) {
                document.getElementById("checklen").innerHTML = curr.toString();
            } else {
                document.getElementById("checklen").innerHTML = '0';
                document.getElementById("subject").readOnly = true;
            }
        }
    </script>
</head>
<body>
    <div class="pbt cl">
        <textarea id="subject" maxlength="80" onkeyup="checkLength(this)" accesskey="1" tabindex="11"></textarea>
        <span id="subjectchk">还可输入
        <strong id="checklen" style="color: #FF0000">80</strong>
            个字符
        </span>
        <span id="postNameRule" class="spn_flag_1" style="display: none"></span>
    </div>
</body>
</html>
复制代码

 

posted on   £冷☆月№  阅读(7876)  评论(0编辑  收藏  举报
编辑推荐:
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?

< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5
点击右上角即可分享
微信分享提示