使用淘汰赛 js 自动增长 textarea

Question

我已经实现了在 keyup 事件上自动扩展 textarea 高度的逻辑。但是，一旦值通过敲除自定义绑定绑定到 textarea，我希望 textarea 也初始化其高度。任何解决方案？（仅使用 KnockoutJS，不使用 jQuery 或任何其他库。）

Answer 1

我强烈建议不要使用事件来触发调整大小。相反，您可以使用textInput绑定来跟踪 observable 中的输入并订阅那里的更改。

下面是一个例子：

<textarea data-bind="textInput: value, autoResize: value"></textarea>

ko.bindingHandlers.autoResize = {
  init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
    ko.computed(function() {
      ko.unwrap(valueAccessor());
      resizeToFitContent(element);
    })
  }
};

这是有效的，因为：

• 的textInput结合写入任何输入变化到可观察到的value变量。
• 在computed使用这个值来触发调整大小。这会自动创建订阅。

这比一种keydown方法更好，因为它处理诸如Right Mouse Button > cut

示例也显示event等效项：

<textarea data-bind="textInput: value, autoResize: value"></textarea>

ko.bindingHandlers.autoResize = {
  init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
    ko.computed(function() {
      ko.unwrap(valueAccessor());
      resizeToFitContent(element);
    })
  }
};