Question

我的JS是有限的，我在复制Materialize框架中看到的<textarea>功能时遇到了问题（滚动到<textarea>部分）。

我基本上希望我的<textarea>能够根据.val()的{{1}}顺利展开。完全像我提供的链接中的示例。

我的代码如下：

<textarea>

提前致谢。

Answer 1

使用你的代码，你在第一个keyup（）上添加一个自动高度，然后在下一个keyup（）上它仍然是自动的。

我认为您必须获取this stack之类的行号，获取line-height，并为每个keyup和keydown计算适当的高度。

所以也许这样的事情（我认为缺少一个动态的滚动修复）：

// Should be in a JS utility file
String.prototype.lines = function() {
  return this.split(/\r*\n/);
}
String.prototype.lineCount = function() {
  return this.lines().length;
}

// The code
$(document).on('keyup keydown', 'textarea', function () {
  var loElem = $(this),
    lsValue = loElem.val();
  loElem.animate({minHeight: lsValue.lineCount() * 14}, 250);
});

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

复制textarea动画功能

1 个答案: