使用jquery从多个文本框值中的字符计数为单个最大值

debugcn 发表于 Dev

波利德夫

我想使用多个文本框来计算字符。我搜索了很多链接，并且堆栈溢出的答案也。但是我没有得到正确的答案。我已经查看了下面链接的答案，但这是两个文本框的两种类型的最大计数。但就我而言，我想对所有文本框使用最大字符160进行计数。它应该合并所有这些输入，并且每次应该对具有多个输入的JQuery字符计数器的值进行计数

我的代码在这里

$('#Loc').keyup(function () {

            var len = $(this).val().length;
            var $msg = $("#charNum");
            if (len > 160) {
                var output = $(this).val().substring(0, 160);
                var msglength = 2;
                //$(this).val(output);

                $msg.html(len + "/" + msglength + " sms left");
            } else {
                $msg.html(160 - len + " characters left");
            }
        });

上面的代码用于第一个文本框。

 $('#Contn').keyup(function () {
            var Vaclen = $('#Vac').val().length + $('#Loc').val().length;
            var len = $(this).val().length;
            var $msg = $("#charNum");
            if (len > 160) {
                var output = $(this).val().substring(0, 160);
                var msglength = 2;
                //$(this).val(output);

                $msg.html(len + "/" + msglength + " sms left");
            } else {
                $msg.html(Vaclen - len + " characters left");
            }
        });

我已附上屏幕截图。在此处输入图片说明

如何合并所有文本框的值以及如何显示？

我的小提琴在这里

布山卡瓦德卡

试试这个jQuery：

在这里，您需要为输入文本编写两个事件。一种是关注焦点，在其中您将计算除焦点输入之外的总文本长度，另一种是针对焦点输入的键入事件，在该事件中您必须获取所有输入的总文本长度。

$(document).ready(function () {
            var count = 0; // 
            var focusCount = 0;

        $('input[type=textbox]').focus(function(){

            focusCount = $(this).val().length;
            count = 0;              
            // get total text length
            $('input[type=textbox]').each(function(){
                count +=  $(this).val().length;
            });
            // remove text length of focused input from total count
            count-=focusCount;
        });

        $('input[type=textbox]').keyup(function () {
                focusCount = $(this).val().length;
               $('#charNum').text(160 - (count+focusCount));
        });
    });

工作JSfiddle

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。