如何自动调整文本区域内的字体大小以避免溢出

Question

如何调整文本区域的字体大小以适应文本区域，这样就不会出现滚动条？我有一个maxlength属性集，所以没有人能得到足够小的字体大小。

Answer 1

我相信我找到了一个与你想要的内容相关的旧帖子：https://stackoverflow.com/a/32177958/19655623

在评论的底部有一个代码的预览

Answer 2

希望这会有所帮助。感谢

/* CSS */
textarea {
font-size: 20px;
resize: none;
overflow: hidden;
}
<!--HTML-->
<textarea onkeydown="reduceFontSize()" id="myTextarea" maxlength="100"></textarea>
// JS
function reduceFontSize() {
let textArea = document.getElementById("myTextarea");
if (textArea.clientHeight < textArea.scrollHeight) {
textArea.style.height = "46px";
textArea.style.width = "235px";
textArea.style.fontSize = "12px";
}
}