文本框高度自适应不出滚动条

$("#BlessingText").scroll(function () {
                if ($(this).scrollTop() != 0 && $(this).height() < 150) {
                    var height = $(this).height() + $(this).scrollTop();
                    $(this).height(height);
                }
            }).keydown(function (e) {
                var _this = this;
                //如果点击删除
                if (e.which == 8 && $(_this).val().length > 0) {
                    //获取汉字个数
                    var clength = ((c = escape($(_this).val().replace(/%u/g, ''))).length - c.replace(/%u/g, '').length) / 2;
                    //因为汉字占两个字母的位置,而字符串.length是不这么算的汉字也是1,所以获取长度的时候加上汉字的个数
                    var length = $(_this).val().length + clength;
                    //每行可以输入多少个字母(减去10是因为有padding,除以7是因为设置的font-size是14px但是字母只占7px)
                    var ln = Math.floor(($(_this).innerWidth() - 10) / 7);
                    //获取现在行数
                    var row = Math.ceil(length / ln);
                    //获取文本框中可以展示的行数(减去10是跟padding,除以20是行高)
                    var hasrow = ($(_this).innerHeight() - 10) / 20;
                    //如果行数小于显示行数重置大小
                    if (row < hasrow) {
                        $(_this).height(row * 20);
                    }
                }
            });

  这个是一个文本框自适应的一段jq写法,在手机端是可行的.已测试

posted @ 2016-03-11 19:12  Robert·Hou  阅读(650)  评论(0编辑  收藏  举报