读书人

textarea 限制篇幅输入

发布时间: 2012-08-31 12:55:03 作者: rapoo

textarea 限制字数输入

<form action="" id="commentForm" name="commentForm" method="POST">    <textarea id="commentText" name="commentText" rows="4" cols="50" maxNum="500"></textarea>    <p type="submit" value="点评" disabled="true"></input>限1~500字之内,还可以输入<span id="num" name="code">textarea{width:98%;height:80px;_width:490px;overflow-y:auto;}.c-tip .number{color:#f56600;}.c-tip .btn{float:right;}

   var commentText = document.getElementById('commentText'),        num = document.getElementById('num'),        maxNum = commentText.getAttribute('maxNum'),        subBtn = document.getElementById('subBtn');    subBtn.setAttribute('disabled',true);        var changeFn = function(){        var val = commentText.value;        if(val){            val = val.replace(/^\s+|\s+$/g,'');        }        if(val.length == 0){            subBtn.setAttribute('disabled',true);        }else{        if(val.length > maxNum){            subBtn.setAttribute('disabled',true);        }else{            subBtn.removeAttribute('disabled');        }        }        num.innerHTML = (maxNum - val.length);    };    if(/MSIE ([^;]+)/.test(navigator.userAgent)){           commentText.onpropertychange = changeFn;    }else{        commentText.addEventListener('input',changeFn,false);    }    commentText.onkeyup = changeFn;

读书人网 >Web前端

热点推荐