jQuery字符数

Question

我正在处理字符数based on this post 我想在窗口加载时调用该函数，但似乎有问题，否则一切正常 任何人都可以帮忙计算负荷。
heres my fiddle

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 example

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

Answer 2

这是我写的一个快速简单的jQuery插件。您需要做的只是$("#element_id").jqCounter();给输入或textarea一个字符计数器。它响应粘贴，变化和我能想到的其他一切。

您必须为其设置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);
 });
});