代码改变世界

textarea标签提示录入剩余字数

2018-01-17 14:08  不痒不痛  阅读(1805)  评论(0编辑  收藏  举报

textarea标签提示录入剩余字数

<textarea onkeydown="checkMaxInput(this,300)" onkeyup="checkMaxInput(this,300)" onfocus="checkMaxInput(this,300)" onblur="checkMaxInput(this,300);resetMaxmsg()" style="width:99%;height:190px;" placeholder="这里写内容"></textarea>
                    

 

 

js方法

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

    var strResult;  
    var $obj = $(obj);  
    var newid = $obj.attr("id") + 'msg';  

    if (obj.value.length > maxLen) { //如果输入的字数超过了限制  
        obj.value = obj.value.substring(0, maxLen); //就去掉多余的字  
        strResult = '<div style="text-align:right;"><span id="' + newid + '" class=\'Max_msg clearfix\' >剩余:' + (maxLen - obj.value.length) + '字</span></div>'; //计算并显示剩余字数  
    }  
    else {  
        strResult = '<div style="text-align:right;"><span id="' + newid + '" class=\'Max_msg clearfix\' >剩余:' + (maxLen - obj.value.length) + '字</span></div>'; //计算并显示剩余字数  
    }  

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

//清空剩除字数提醒信息  
function resetMaxmsg() {  
    $("span.Max_msg").remove();  
}