textarea預設的高度不是對著內容變化，而是隨著內容增多，出現了滾動條。目前的需求是實現乙個能夠輸入的textarea，並且高度跟著內容變化。
發現了乙個比較好用的外掛程式flextext，但是這個基於jquery寫的，目前的技術棧是react，所以簡單看了下，然後用原生的js模擬了乙個實現。
html結構：
class="body">
class="container">
class="pre">
pre>
class="content"
placeholder="請輸入內容"
oninput="changecontent()">
textarea>
div>
div>
最外層的div不需要樣式，重點在裡面的pre和textarea
textarea絕對定位，高度為100%，也就是高度隨著外面container的高度變化。
pre是塊元素，占用空間但是不可見。在textarea輸入的時候，實時的把內容寫入到pre中，因為pre是container的子元素，且所以外層container的高度會被pre的高度撐開。
.container
.content
.container
pre
function changecontent()
charset="utf-8">
name="viewport"
content="width=device-width, initial-scale=1">
.container
.content
.container
prestyle>
head>
class="body">
class="container">
class="pre">
pre>
class="content"
placeholder="請輸入內容"
oninput="changecontent()">
textarea>
div>
div>
function
changecontent()
script>
body>
html>
onkeyup使用複製貼上時，高度不能自動改變
onchange事件：在內容改變（兩次內容有可能相等）且失去焦點時觸發，不能實時同步
oninput事件：html5 的標準事件，可以用來檢測元素通過使用者介面發生的內容變化，在內容修改後立即被觸發
實現 textarea隨內容高度自動變化
原理 生成乙個新的textarea，不停獲取當前textarea最新的值，然後計算高度賦給當前的textarea var addhandler window.addeventlistener?function elem,event,handler function elem,event,handle...
實現textarea標籤高度隨內容自動變化
預設情況，textarea標籤的高度是不會隨文字內容自動撐開的，即其高度固定，高度過多時會使textarea標籤出現滾動條 但是有時候會有需求 實現textarea標籤高度隨內容自動變化，那麼可以利用scrollheight屬性實現，如下 html部分 js部分 function makeexpan...
css中解決textarea高度隨內容自適應的問題
目前的輸入框實現有兩種方法 input input輸入框只能實現一行，裡面的內容不能分行顯示 textarea textarea可以實現多行輸入，但是高度卻無法自適應，並且會遇到textarea始終會與下面有一段間距，解決方法 加 vertical align middle 即可 那麼言歸正傳，如何...