jQuery - 自动扩展文本区域不处理粘贴的输入

Question

我正在尝试根据输入的文本自动扩展/缩小文本区域。 textarea 的指定高度为250px，并且可以在overfow: auto 使用滚动条进入之前自动扩展到450px。在文本区域中输入文本时它可以完美运行，但在粘贴大量文本时效果不佳。

在此处查看小提琴：https://jsfiddle.net/ynv6yta8/1/

还有一个sn-p：

// auto-expand/shrink text area
$('#mytextarea').bind('input propertychange paste', function() {
  var oldHeight = parseInt($(this).height());
  
  if (this.scrollHeight < 450) {
    $(this).height(0).height(this.scrollHeight);
  }
}).change();

#mytextarea {
  height: 250px;
  width: 450px;
  min-height: 250px;
  min-width: 450px;
  resize: none;
  overflow: auto;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="mytextarea"></textarea>

我没有在小提琴中留下任何调试语句，但该事件确实在粘贴时被正确触发，但 this.scrollHeight 总是评估为 250px 附近的东西，即使粘贴的文本非常大。我猜this.scrollHeight 在paste 事件被触发时还没有更新？我该如何解决这个问题？

Answer 1

这对我有用：

$(document).on("input", "textarea", function()
{
   $(this).prop('style').cssText = 'height:auto;';
   $(this).prop('style').cssText = 'height:' + $(this).prop('scrollHeight') + 'px';
});

CSS：

textarea
{
    resize:none;
    max-height:450px;
    min-height:250px;
}

灵感来自https://codepen.io/vsync/pen/czgrf

jsfiddle：Here