jquery - jQuery 字符数

Question

我正在根据这篇文章进行字符计数。
我想在窗口加载时调用该函数，但似乎有问题，否则一切正常。
任何人都可以帮忙计算负载。
这是我的小提琴

function countChar(val){
    var len = val.value.length;

    if (len >= 500) {
            val.value = val.value.substring(0, 500);
            $('#stat span').text(0);
    }else {
            $('#stat span').text(500 - len);
    }
}

$(function(){
    var inputT = $('#descTextArea').val();
    //countChar(inputT);//this is breaking the code

    $('#descTextArea').keyup(function(){
        countChar(this);
    });

});

Answer 1

试试这个

function countChar(val) {
    var len = val.value.length;
    if (len >= 500) {
        val.value = val.value.substring(0, 500);
        $('#stat span').text(0);
    } else {
        $('#stat span').text(500 - len);
    }
}
countChar($('#descTextArea').get(0));
$('#descTextArea').keyup(function() {
    countChar(this);
});​

jsFiddle 示例

在您的代码中，您将字符串（值）传递给试图获取元素长度的函数。相反，通过调用countChar($('#descTextArea').get(0));您只是传递元素并允许函数按照您的意图查找输入的长度。

Answer 2

这是我写的一个快速简单的 jQuery 插件。您需要做的就是$("#element_id").jqCounter();给输入或文本区域一个字符计数器。它响应粘贴、更改和我能想到的所有其他内容。

您必须设置 maxlength 属性才能使其工作，即。<input maxlength=45 />或者<textarea maxlength=45></textarea>

<script>
(function($) {
    $.fn.extend({
        jqCounter : function(givenOptions) {
            return this.each(function() {
                var $this = $(this),
                    options = $.extend({
                        divider: "/"    // The diveder character between the count and max
                    }, givenOptions);
                // 0 chars or max count not set or already setup
                if($this.attr("maxlength") <= 0 || $this.hasClass("jqCounter")) return;

                // Add the counter text after the element
                var span= $("<span style=\"font-size:10px;\">"+$this.val().length+options.divider+$this.attr("maxlength")+"</span>")
                .insertAfter($this);

                // Add a class
                $this.addClass("jqCounter")
                // React to keypresses, changes, paste, etc. and change the counter
                .on('focus blur propertychange change input paste keydown keyup keypress', function(){
                    setTimeout(function(){
                        var maxChars = $this.attr("maxlength"),
                            txtLength = $this.val().length;
                        span.text( txtLength + options.divider + maxChars );
                        },
                    1);
                });
            });
        }
    });
})(jQuery);

$(document).ready(function()
{
  // All text areas will have a content counter
  $("textarea").jqCounter();
});
</script>

Answer 3

使用 $(document).ready() 在窗口加载时绑定事件处理程序，如下所示：

$(document).ready(function() {
    $('#descTextArea').keyup(function(){
      countChar(this);
 });
});