jQuery MiniUI

标题: textarea如何实现高度自适应，显示出所有内容 [打印本页]

作者: java666 时间: 2017-10-11 16:57:05 标题: textarea如何实现高度自适应，显示出所有内容

就是让textarea显示出所有内容，至于滚动条则可有可无，求大神告知

作者: felt 时间: 2017-10-11 18:58:46

只能设置具体的尺寸，不能自适应内容。

作者: java666 时间: 2017-10-12 08:47:15

felt 发表于 2017-10-11 18:58
只能设置具体的尺寸，不能自适应内容。

如果不用textarea还有别的办法吗，因为要打印页面，必须把所有内容都显示。

作者: dforce 时间: 2017-10-12 09:55:06

java666 发表于 2017-10-12 08:47
如果不用textarea还有别的办法吗，因为要打印页面，必须把所有内容都显示。 ...

那不如你直接用div来显示了。

作者: haohao 时间: 2018-10-22 09:13:20

dforce 发表于 2017-10-12 09:55
那不如你直接用div来显示了。

用div怎么实现？我也碰到了同样的问题，textarea录入时，能自动撑开。但是页面显示时显示不全

作者: felt 时间: 2018-10-22 13:32:57

本帖最后由 felt 于 2018-10-22 13:35 编辑

haohao 发表于 2018-10-22 09:13
用div怎么实现？我也碰到了同样的问题，textarea录入时，能自动撑开。但是页面显示时显示不全 ...

可以放一个偏移看不见的div来放textaea内容，计算出高度，再赋值给textarea来计算原本的高度，
<div id="t1" class="mini-textarea" style="width:300px;height:100%">

</div>
<div id="d1" style="display:none;width:300px;height:auto;word-break:break-all;padding:1px;letter-spacing:1px;position:absolute;left:-1000px">

</div>

  mini.parse();
var t1 = mini.get("t1");
t1.on("blur", function (e) {
      var value = e.sender.getInputText();
      if (value) {
         $("#d1").show();
         $("#d1").text(value);
            var height = $("#d1").height();
            t1.setHeight(height);
            $("#d1").hide();

      }
})

作者: haohao 时间: 2018-10-22 16:56:14

felt 发表于 2018-10-22 13:32
可以放一个偏移看不见的div来放textaea内容，计算出高度，再赋值给textarea来计算原本的高度，

谢谢，试试

作者: niccs007 时间: 2023-2-23 21:28:22

haohao 发表于 2018-10-22 16:56
谢谢，试试

t1.on("blur", function (e) {
      var value = e.sender.getInputText();
      if (value) {
         var lenArr = value.split("\n");
         alert(lenArr.length);
         t1.setHeight(lenArr.length*22);
      }
});

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)