2014-10-08 37 views
0

我有一個禁用的textarea,它包含未知數量的文本,因爲它與註釋一起使用。例如,已禁用textarea顯示全文

<textarea class="col-md-10 col-sm-12 col-xs-12" disabled="true"> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. In tortor sapien, convallis id molestie at, egestas et ex. Mauris sagittis lorem ut nunc commodo scelerisque. Sed congue, est in mattis vulputate, mi mauris facilisis lorem, in volutpat mi urna ac libero. Ut tempus nulla sed massa ullamcorper aliquam. Nullam laoreet purus vel mi feugiat, luctus vestibulum nunc vestibulum. Nulla lacinia sapien eu velit semper tristique et eu est. Aliquam sit amet facilisis mi. Nullam nec ullamcorper orci, auctor accumsan nibh. Morbi quis lacus velit. Nullam aliquet turpis quam, in pharetra lacus sodales at. Suspendisse id neque sed dui commodo aliquet. Vivamus blandit eleifend interdum. Morbi ac odio nulla. Mauris cursus ultrices ex, in placerat risus. Ut dictum justo a magna ornare pharetra. 
</textarea> 

的問題是,因爲textarea被禁用它不是使用箭頭使用IE瀏覽器時,他們可以滾動的用戶非常清楚。我想要做的解決方案是顯示所有文本,因此不需要滾動。我一直無法找到一種方法來迫使textarea一路吹滅。

如何將所有文字顯示在文本框中? Javascript和jQuery是開放使用的,但它需要在所有瀏覽器上運行,包括移動設備和IE9。

+3

textarea是否會在任何時候啓用?它需要成爲一個textarea嗎? – Jason 2014-10-08 14:59:56

+0

不可以,因爲我們不允許編輯評論,所以不會被禁用。它不一定是文本區域,但需要具有相同的外觀/感覺才能與我的公司用戶體驗指南一起流動。我甚至沒有想過把它放在「p」之類的東西里面。偉大的思想! – 2014-10-08 15:02:40

+0

有插件可以使這個工作,或者你可以風格的div看起來像一個textarea – Spokey 2014-10-08 15:12:37

回答

1

將文本轉換爲div和風格它像用CSS一textarea

+0

我遇到的唯一問題是,當用戶添加一個休息/輸入沒有辦法讓我表明。我使用了'white-space:pre-wrap;'來解決這個問題。 – 2014-10-08 15:53:46

0

使用CSS:

textarea { 
    overflow:hidden; 
    width:auto; 
    height:auto; 

簡單:)。順便說一句,一個較短的版本是,對於一個殘疾人textarea的,是這樣的:

<textarea disabled>