要動態調整textarea的寬度和高度以包含文本,你可以通過JavaScript來實現。下面是一個示例代碼:
<textarea id="myTextarea" oninput="adjustTextareaHeight(this)"></textarea><script>
function adjustTextareaHeight(textarea) {
// 重置textarea的高度
textarea.style.height = 'auto';
// 調整到適合文本內容的高度
textarea.style.height = textarea.scrollHeight + 'px';
}
// 在頁面加載完成后調用一次,以確保初始文本也能正確顯示
window.onload = function() {
var textarea = document.getElementById('myTextarea');
adjustTextareaHeight(textarea);
};
</script>
上述代碼中,我們綁定了textarea的oninput事件,這樣在用戶輸入文本時會觸發adjustTextareaHeight函數。該函數會重置textarea的高度為默認值,并根據文本內容的高度來調整高度。
此外,在頁面加載完成后,我們還調用了adjustTextareaHeight函數來確保初始文本也能正確顯示。你可以將myTextarea替換為你自己的textarea的id。
通過這種方式,textarea的高度會根據文本內容進行自適應調整,從而完整顯示所有文本。