laylui textarea的限制字数的

示例效果图:

7a7348fd4c7483bec689ad42ee7a47e7994357.jpg

css部分:

.layui-input-block {

        position: relative;

    }

 

    .word {

        position: absolute;

        right: 10px;

        bottom: 10px;

        color: #aaa;

        font-size: 12px;

    }

html部分:

<div class="layui-form">

<div class="layui-form-item">

        <label class="layui-form-label layui-required">消息简介:</label>

        <div class="layui-input-block">

            <textarea placeholder="请输入消息简介" oninput="wordLeg(this);" maxlength="100" onpropertychange="if(value.length>100) value=value.substr(0,100)" name="desc" class="layui-textarea"></textarea>

            <div class="word"><span class="text_count">0</span>&nbsp;/&nbsp;<span class="num_count" id="numCount">100</span></div>

        </div>

    </div>

</div>

js部分:

//字数限制

window.wordLeg = function (obj) {

      var currleg = $(obj).val().length;

      var length = $(obj).attr('maxlength');

      if (currleg > length) {

           layer.msg('字数请在' + length + '字以内');

        } else {

           $('.text_count').text(currleg);

       }

 }

posted on 2021-03-03 15:34  totau  阅读(1121)  评论(0编辑  收藏  举报

导航