javascript - 如何使输入字段在输入时垂直扩展而不是水平扩展?

标签 javascript html css

问题

我输入了一个内容。现在,当我键入时,输入将调整其大小,使其适合其中的文本量。现在的问题是,我试图在互联网上寻找一些答案,但所有的答案都是水平扩展的,但我希望当它达到某个点时,它会垂直扩展而不是水平扩展。我也不想想要制作一个内容可编辑的跨度或div。我怎样才能做到这一点?

一些代码

<html>
  <body>
    <input>
  </body>
</html>

最佳答案

输入仅适用于单行输入。甚至不可能在输入中添加新行。

您正在寻找的是适合内容高度的文本区域。这可以通过 JavaScript 实现:

document.querySelector('textarea').addEventListener("input", function(){
  this.style.height = '0px';
  this.style.height = this.scrollHeight + 'px';
})
<textarea></textarea>

关于javascript - 如何使输入字段在输入时垂直扩展而不是水平扩展?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67960185/

相关文章:

javascript - React fetch 给我一个 chop 的 JSON 响应

html - 如何获得完全响应的圆形菜单(包括悬停+链接功能)?

html - 如何在 div 中将表格居中?

javascript - 如何摆脱告诉我将 svg 属性更改为驼峰大小写的 react 错误警告?

css - Bootstrap - 如何覆盖 css?

JavaScript 使用数组元素进行解构

javascript - 创建具有 3 个属性的 json 文件

jquery - 为什么这个 jquery 选择器不起作用?

python - 为什么此 Web 托管的 Python 代码会导致 500 内部错误?

javascript - Shiny 数据表中的单选按钮,用于一列中的 "subselection"行/分组