zoukankan      html  css  js  c++  java
  • js仿微博输入框字数检测

    /*
    暂时不支持鼠标复制检测,但可以通过设置定时器或者blur的时候检测
    */
    function TextNumCheck(elem) {
        this.elem = document.getElementById(elem);
    }
    TextNumCheck.prototype = {
        //跨浏览器获取文本
        text:function (obj, string) {
            return obj.innerText ? obj.innerText = string : obj.textContent = string;
        },
        //动画变色
        animBg:function (obj) {
            setTimeout(function () {
                obj.style.backgroundColor = "#fe9900";
                setTimeout(function () {
                    obj.style.backgroundColor = "#fff";
                }, 150);
            }, 250);
        },
        /**
         * /检测已经输入多少字符
         * @param alrElem 要显示输入多少字符的元素id
         * @return {*}
         */
        curNum:function (alrElem) {
            var obj = document.getElementById(alrElem);
            var s = this.elem.value.length;
            this.text(obj, s);
            return this;
        },
        /**
         * 检测剩余多少字符
         * @param remainELem 要显示剩余字符的元素id
         * @param maxNum
         */
        numRemain:function (remainELem, maxNum) {
            var obj = document.getElementById(remainELem);
            var _thisElem = this.elem;
            var s = _thisElem.value.length;
            if (typeof maxNum === "undefined") {
                maxNum = 500;
            }
            var remain = maxNum - s;
            if (remain < 0) {
                _thisElem.value = _thisElem.value.substring(0, maxNum);
                this.animBg(_thisElem);
            }
            this.text(obj, remain);
            return this; 
        }
    };
    var txtNumCheck = new TextNumCheck("cErr_con");
    document.getElementById("cErr_con").onkeyup = function () {
        txtNumCheck.curNum("lim_alreay").numRemain("lim_remain");
    };
    

      

  • 相关阅读:
    CMS之图片管理(4)
    CMS之图片管理(2)
    CMS:文章管理之控制器
    CMS:文章管理之视图(1)
    CMS:文章管理之视图(3)
    CMS:文章管理之视图(2)
    影响Incremental checkpoint position的条件
    oracle中一个数据文件的最大值(非lob)
    X$KCCLE
    图一时之快:手动释放Linux服务器内存
  • 原文地址:https://www.cnblogs.com/webFrontDev/p/2786033.html
Copyright © 2011-2022 走看看