動態寬度textarea無包裝

我如何使一個textarea不強制換行並擴展其大小以匹配內容而不是顯示滾動條？動態寬度textarea無包裝

我需要一個帶動態寬度的textarea。寬度應該是textarea的最寬行。我的意思是應該沒有包裝，寬度應該改變一長串。

來源

2015-10-27 user3848987

我不知道這個問題是在這裏。你想要一個文本區域的整個窗口的寬度，你不希望文本換行？聽起來就像你想要一個文本類型的全寬輸入框（文本框）。 – jnoreiga

您是否希望文本字段根據輸入的單詞數量更改大小？你有沒有嘗試過任何東西，給我們一個你研究過的東西和你嘗試過的東西的樣本。 –

我想根據輸入的字符數量來改變textarea的寬度。所以如果我輸入一個很長的一行，textarea會變得更寬。我只是找到腳本和職位動態高度的textarea，但我需要一個動態寬度... – user3848987

指定一個輸入偵聽器函數，該函數將滾動寬度和高度與元素的外部寬度和高度進行比較。如果它們不同，則根據需要進行設置。

對於CSS，您需要white-space:nowrap來停止換行和overflow:hidden來擺脫滾動條。

$('.demo').on('input', function(e){ 
 
    this.style.width = ''; 
 
    this.style.height = ''; 
 
    if(this.scrollWidth > this.clientWidth) this.style.width = this.scrollWidth + 'px'; 
 
    if(this.scrollHeight > this.clientHeight) this.style.height = this.scrollHeight + 'px'; 
 
})

.demo { 
 
    white-space: nowrap; 
 
    overflow: hidden; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea class="demo"></textarea>

來源

2015-10-27 21:36:06

動態寬度textarea無包裝

回答

相關問題