0

こんにちは:) Javascript文字カウンターを備えたHTMLテキストエリアがあります。誰かが「参照」ボタンをクリックして、書き込み中のテキスト領域にメディアを追加するときに、残りの文字数を 23 文字減らしたいと考えています。私もPHPを使っています。どうすればいいですか？:)

ここにHTMLがあります

    <form id="form" method="post" action="" enctype="multipart/form-data">
        <div>
            <label for="message2">Type your message</label>
            <textarea ID="message2" onkeyup="textCounter(this,'counter',140);" name="status"></textarea>
            Add Picture<input type="file" name="image" /><br />
            <input class="button" type="submit" value="Tweet" /><br />
        </div>
    </form>

そして、Jquery

   <script>
$(document).ready(function(){   

    $("#message2").charCount({
        allowed: 140,       
        warning: 10,
        counterText: ''
    });
});

そしてCharCount.js

    (function($) {

$.fn.charCount = function(options){

    // default configuration properties
    var defaults = {    
        allowed: 140,       
        warning: 25,
        css: 'counter',
        counterElement: 'span',
        cssWarning: 'warning',
        cssExceeded: 'exceeded',
        counterText: ''
    }; 

    var options = $.extend(defaults, options); 

    function calculate(obj){
        var count = $(obj).val().length;
        var available = options.allowed - count;
        if(available <= options.warning && available >= 0){
            $(obj).next().addClass(options.cssWarning);
        } else {
            $(obj).next().removeClass(options.cssWarning);
        }
        if(available < 0){
            $(obj).next().addClass(options.cssExceeded);
        } else {
            $(obj).next().removeClass(options.cssExceeded);
        }
        $(obj).next().html(options.counterText + available);
    };

    this.each(function() {              
        $(this).after('<'+ options.counterElement +' class="' + options.css + '">'+ options.counterText +'</'+ options.counterElement +'>');
        calculate(this);
        $(this).keyup(function(){calculate(this)});
        $(this).change(function(){calculate(this)});
    });

};

})(jQuery);

4

2 に答える 2

1

オブジェクトの属性を使用して data-maxlength="140" (jquery で $(obj).data("maxlength") を使用して参照できます) のように最大長を決定するように charCount を書き直すことが理想的です。

次に、長さを動的に調整できます。コードに参照ボタンが表示されないため、必要に応じてセレクターを更新してください。

$("browse").click(function() {
    $("#message2").data("maxlength", 116).change();
    // calling change() triggers recalc of length
});
于 2013-10-29T18:59:01.517 に答える