input及textarea输入字数限制

用法

id及class 描述
#nickname 目标text及textarea元素ID
.J_lengthMin 限制字数分子
.J_lengthMax 限制字数分母

示例

HTML

<div class="baie-cells baie-cells_form">
    <div class="baie-cell">
        <div class="baie-cell__hd"><label class="baie-label" for="nickname">圈昵称<em class="circle_mark">*</em></label></div>
        <div class="baie-cell__bd">
            <input class="baie-input" type="text" name="nickname" id="nickname" placeholder="请输入圈昵称">
        </div>
        <div class="baie-cell__ft">
            <span class="baie-limite-num"><em class="J_lenthMin">0</em>/<em class="J_lenthMax"></em></span>
        </div>
    </div>
</div>

JS

Baie.limitinput('#nickname',9);//目标元素ID  限制字数

组件代码

Baie.limitinput = function(target,count) { //目标input元素ID 限制字符个数
    var _target = $(target),
        _name = _target.val(),
        _length = _name.length;
    _target.parent().next().find('.J_lenthMax').text(count);
    if(_target){
        _target.parent().next().find('.J_lenthMin').text(_length);
    }
    _target.on('keyup',function(e){
        var $self = _target;
        e.stopPropagation();
        var textLen = _target.val().length;
        if(textLen > count){
            var char = _target.val();
            char = char.substr(0,count);
            _target.val(char);
            textLen = count;
            layer.open({
                content: '请控制在'+ count + '个字内',
                skin: 'msg',
                time: 1
            });
        }
        $self.parent().next().find('.J_lenthMin').text(textLen);
    })
}

results matching ""

    No results matching ""