zoukankan      html  css  js  c++  java
  • js监测输入框字数(一个汉字等于两个字母),超出限制输入无效

      产品要求输入框加上文字字数限制,你傲气甩头,没问题随便加,姐姐一个maxlength属性搞定,产品一句实时展示已输入字数且一个汉字等于两个字母,你就不淡定了,这是需要js控制的啊!没事,加呗~

      首先就是html

    <input type="text" class="input-limit" name="news_type[type_name]" value="" lay-limit="20"/>

      接下来就是js控制了

    $('.input').on('click',function(){
        var $this = $(this);
        var value = '';
        var max = $this.attr('lay-limit');
        var $span = $('<span class="input-limit-tip">'+strLength($this.val()) + '/' + max);
        $span.insertAfter($this);
        $this.on('input',function(){
            var strlen = strLength($this.val());
            if(strlen > max){
                $this.val(value);
            }else{
                $this.next('.input-limit-tip').text(strLength($this.val())+ '/' +max);
                value = $this.val();
            }
        })
    })
    
    function strLength(str){
        var reg = /[^x00-xff]/g;//匹配汉字
        return Math.round(str.replace(reg,"**").length) / 2;
    }
    码农随笔防失忆,只为记录风雨路上的脚丫印印~
  • 相关阅读:
    1143 Lowest Common Ancestor (30)
    PAT 1135 Is It A Red-Black Tree
    PAT 1119 Pre- and Post-order Traversals
    1102 Invert a Binary Tree(25 分)
    PAT总结
    c++ getline的用法
    PAT 1049 Counting Ones (30)
    PAT 1022 Digital Library (30)
    java jar包
    NIO的理解
  • 原文地址:https://www.cnblogs.com/bella-lin/p/8204068.html
Copyright © 2011-2022 走看看