1

非常に単純な単語カウンターがあり、ニーズに十分に対応しています。ただし、ここで変更を加える必要があります。http://jsfiddle.net/MUSXU/1で JSfiddle を参照してください。

(function($){
    $.fn.textareaCounter = function(options) {
        // setting the defaults
        // $("textarea").textareaCounter({ limit: 100 });
        var defaults = {
            limit: 100
        };  
        var options = $.extend(defaults, options);

        // and the plugin begins
        return this.each(function() {
            var obj, text, wordcount, limited;

            obj = $(this);
            obj.after('<span style="font-size: 11px; clear: both; margin-top: 3px; display: block;" id="counter-text">Max. '+options.limit+' words</span>');

            obj.keyup(function() {
                text = obj.val().replace(/\s+/g, " ");;
                if(text === "") {
                    wordcount = 0;
                } else {
                    wordcount = $.trim(text).split(" ").length;
                    var URLs = text.match(/([^\s])+\.(com|net|org|biz|gov|edu|mobi|info|ca|us|mil)/g);
                    if(URLs != null && URLs.length > 0){
                      wordcount += (URLs.length*2);
                    }
                }
                if(wordcount > options.limit) {
                   obj.next().html('<span style="color: #DD0000;">-' + parseInt(wordcount - options.limit, 10) + ' words left</span>');

                    $("#submit").prop('disabled', true);
                } else {
                    obj.next().html((options.limit - wordcount)+' words left');
                $("#submit").prop('disabled', false);
                } 
            });
        });
    };
})(jQuery);
$('textarea').textareaCounter({limit:15});

ただし、1 つの問題があります。

  1. ページ上のいずれかの文字カウンターが制限を超えている場合は、送信ボタンを無効のままにする必要があります。現時点では、コード化された方法では、送信ボタンは単語数がオーバーすると正常に無効になりますが、次のテキストエリアに入力するとすぐに再び有効になります.

私は JavaScript があまり得意ではなく、必要に応じてこれをハックしただけです。これは、デプロイする前に作業する必要がある最後の作業です。

あなたが貸してくれる助けをいただければ幸いです。

4

1 に答える 1

2

配列を使用して結果を保持し、検証を確認できます。これを見て...

http://jsfiddle.net/kmd97/Up9KS/

var res = [];

 $("#submit").prop('disabled', false);
                    $.each(res, function (index, value) {
                        if (value) {
                            $("#submit").prop('disabled', true);
                            return false;
                        }

このビット onload を追加して、キープレスを模倣します。おそらく、事前に検証を行うための最もクリーンで簡単な方法です。

var press = jQuery.Event("keyup");
press.ctrlKey = false;
press.which = 40;
$("textarea").trigger(press);
于 2013-02-13T17:43:34.373 に答える