2011-07-05 99 views
4

嗨,我有這個自動擴展textarea jquery代碼,目前,除了谷歌瀏覽器,它在某種程度上工作。textarea自動擴展

問題是,當我將樣式padding:3px添加到textarea時,每當我在框中鍵入內容時,它將展開高度。如果我刪除了樣式填充,它將很好地工作。

測試是在這裏:http://jsfiddle.net/JkxgB/(使用谷歌瀏覽器進行測試)

我一直在試圖找出原因,如果任何人都可以在這裏提供一些線索將不勝感激。先謝謝了。

+0

爲什麼使用價值的長度?你不應該算數線嗎? – Christian

+0

雖然不確定,但這是我得到某處的插件。 – pakito

+0

不直接相關:您正在無限期地擴展。這可能會造成一些煩惱。你可能要考慮只擴展到某個點,然後添加滾動條。 – Nivas

回答

2

我建議你使用這個插件來代替:

http://plugins.jquery.com/project/TextAreaResizer

StackOverflow上使用此插件的文字區域!我必須說更多嗎?

希望這會有所幫助。乾杯

PS:或者,您可以使用autogrow plugin

+0

感謝您的建議埃德加。首先我需要像自動擴展,所以stackovflw resizer不是我的東西另外許多最新的瀏覽器現在自動支持resizer到textarea,因此這個插件是多餘的 其次,我已經看到並嘗試了很多插件,其中很多插件通常會在文本底部留下額外的空間你輸入。我發佈的插件對我來說是最好的。 – pakito

0

太難過了,你04年前問,我只是看到它。

發生此問題的原因是scrollHeight屬性以像素爲單位返回元素的整個高度;包括填充,但不包括邊框,滾動條或邊距。 (至少在Chrome,IE和Firefox中,這三個我已經測試過)。

編號:Element Scroll Height

所以,我在你的jsfiddle改變line 17如下,和問題解決了。

var h = Math.max(e.expandMin, Math.min(e.scrollHeight - 6, e.expandMax));