Question

我有一个textarea根据我输入的内容调整大小。我使用KyleMit的解决方案来完成它。

HTML：

<textarea onkeyup="textAreaAdjust(this)" style="overflow:hidden"></textarea>

JS：

function textAreaAdjust(o) {
o.style.height = "1px";
o.style.height = (25+o.scrollHeight)+"px";
}

当用户必须在textarea上键入但textarea中有一个预先填充的值时，这样可以正常工作。调整大小不适用于预填充值。它仅在用户开始在textarea上键入时调整大小。

预填充文本区域的示例

<textarea onkeyup="textAreaAdjust(this)" style="overflow:hidden">Identify, formulate, research literature, and analyze user needs and taking them into account to solve complex information technology problems, reaching substantiated conclusions using fundamental principles of mathematics, computing fundamentals, technical concepts and practices in the core information technologies, and relevant domain disciplines.</textarea>

有没有办法可以通过CSS或JS解决这个问题？

Answer 1

您还必须使用这两行代码，以便在页面加载时使用它，

你可以给文本区域一个id然后你可以用这种方式调用代码，然后在页面加载时调用它，它肯定会工作如下所示

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body onload="callOnPageLoad()">
<script>
function callOnPageLoad(){
	document.getElementById("textareaEx").style.height="1px";
	document.getElementById("textareaEx").style.height=(25+document.getElementById("textareaEx").scrollHeight)+"px";
	}
</script>
<textarea onkeyup="callOnPageLoad()" id="textareaEx" style="overflow:hidden">Identify, formulate, research literature, and analyze user needs and taking them into account to solve complex information technology problems, reaching substantiated conclusions using fundamental principles of mathematics, computing fundamentals, technical concepts and practices in the core information technologies, and relevant domain disciplines.</textarea>
</body>
</html>

Textarea不会使用预先填充的值自动调整大小

1 个答案: