jQuery文本域自动增高插件

【Javascript】

下载

新闻

文章

jQuery文本域自动增高插件

 (function($) {
     $.extend($.fn, {
         textareaAutoHeight: function(H) {
             var maxH = H||1000;
             function fun(){
                 !$.browser.msie && $(this).height(0);//非IE
                 var h = parseFloat(this.scrollHeight);
                 var minH = parseFloat($(this).attr("minH"));
                 h = h < minH ? minH : h > maxH ? maxH : h;
                 $(this).height(h).scrollTop(h).css("overflow-y", h >= maxH ? "scroll" : "hidden");
             }
             this.each(function(){
                 $(this).css({width:$(this).width()+17,overflowY:"hidden"}).attr("minH",$(this).height()).keyup(fun).change(fun).focus(fun);
             })
         }
     });
 })(jQuery);

网上也有类似插件，有些代码很多有些功能不太好。我这只准配置一个最大高参数。最小高参数自动获取默认高为准。同时经过测试设置隐藏滚动条时文本域宽度会变化，所以我事先给它增加17px的宽。让其宽不会变化。

<textarea name="a" cols="30" rows="10"></textarea>
<textarea name="b" cols="30" rows="10"></textarea>
<script type="text/javascript">
    $(document).ready(function(){
        $("textarea").textareaAutoHeight(300);
    });
</script>