textarea 计数实现 全兼容版

2024年5月8日 90次阅读 来源: 我是一个前端

很久以前的文章了 迁移至此

全兼容版javascript字符计数textarea， javascript字符计数textarea，废话不多说直接上代码，亲测好使，兼容所有浏览器。

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>实时计算input字符数量</title>
</head>

<body>
    <input type="text" id="text" name="name" value="">
    <div  id="box">

    </div>
    <script type="text/javascript">
        window.onload = function() {
            var oT = document.getElementById('text');
            var textBox = document.getElementById('box');
            //参数 DOM 回调
             getLength(oT, function(len){
                 textBox.innerHTML = len;
             });

            function getLength(obj,fn){
            //如果是ie
                if (navigator.userAgent.indexOf("MSIE") != -1) {
                    if (navigator.userAgent.indexOf("MSIE 9.0") != -1) {
                        obj.onpropertychange = function() {
                            fn(currentLen(obj.value));
                        };
                    } else {
                        obj.onfocus = function() {
                            timer = setInterval(function() {
                                fn(currentLen(obj.value));
                            }, 30);
                        };
                        obj.onblur = function() {
                            clearInterval(timer);
                        };
                    }
                //其他浏览器直接oninput
                } else {
                    obj.oninput = function() {
                        fn(currentLen(obj.value));
                    };
                }
            }

            function currentLen(value) {
                return value.replace(/[\u4E00-\u9FA50]/g, '..').length;
            }
        };
    </script>
</body>

</html>

你的点赞是我继续的动力！

欢迎多多吐槽指正！谢谢！

    原文作者：我是一个前端
    原文地址: https://segmentfault.com/a/1190000017524278
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞