首页 > 技术文章 > php随笔7-thinkphp OA系统 JS 文本框输入实时控制字数

GaoAnLee 2015-11-14 09:56 原文

JS:

//多行文本输入框剩余字数计算
        function checkMaxInput(obj, maxLen) {
            if (obj == null || obj == undefined || obj == "") {
                return;
            }
          /*if (maxLen == null || maxLen == undefined || maxLen == "") {
                maxLen = 250;
            }*/

           /* var strResult;
            var $obj = $(obj);
            var newid = $obj.attr("id") + 'msg';*/
            
            $('#number').show();

            if (obj.value.length > maxLen) {    //如果输入的字数超过了限制
                obj.value = obj.value.substring(0, maxLen); //就去掉多余的字
                document.getElementById("msg").innerHTML ="剩"+(maxLen - obj.value.length).toString()+"字";
                //strResult = '<a><span id="' + newid + '" class=\'Max_msg\' ><br/>剩(' + (maxLen - obj.value.length) + ')字</span></a>'; //计算并显示剩余字数
            }
            else {
                //strResult = '<a><span id="' + newid + '" class=\'Max_msg\' ><br/>剩(' + (maxLen - obj.value.length) + ')字</span></a>'; //计算并显示剩余字数
                document.getElementById("msg").innerHTML =(maxLen - obj.value.length).toString();
            }

           /* var $msg = $("#" + newid);
            if ($msg.length == 0) {
                $obj.after(strResult);
            }
            else {
                $msg.html(strResult);
            }*/
        }

        //清空剩除字数提醒信息
        function resetMaxmsg() {
            $('#number').hide();
        }
<textarea name="remarks" style="background-color:#CDFF9A;height:285px;width:165px;resize:none;" onkeydown="checkMaxInput(this,120)"  
            onkeyup="checkMaxInput(this,120)" onfocus="checkMaxInput(this,120)" onblur="checkMaxInput(this,120);resetMaxmsg()"></textarea>

<div style="position:absolute;top:200px;left:250px"><a style="display:none" id="number">剩(<span id="msg">120</span>)字</a></div>

 效果:

推荐阅读