我需要让文本框随着文字填充而增加高度。之前我使用过JavaScript/JQuery实现了这个功能。
function expandingTextBox(e) {
$(e).css({'height':'80', 'overflow-y':'hidden'}).height(e.scrollHeight);
}
$('textarea').each(function(){
expandingTextBox(80);
}).on('input', function() {
expandingTextBox(this);
});
这个几乎可以满足要求了。简单来说,我在我的Web应用程序中有一个弹出窗口,我想能够从其他地方拖动对象,并将它们放入我的弹出窗口中,创建新的文本区域,使其调整大小以适应内容。此功能仅在我键入文本框时重新调整文本框大小。
一个同事认为我可以仅使用CSS - 没有JavaScript或JQuery插件来实现此目的?我在互联网上找到的所有其他解决方案都依赖于至少一些JQuery插件(而且我不能轻易地在工作机器上下载新插件)。是否有一种仅使用CSS的方法?
我尝试将文本区域更改为div,并使用contenteditable属性。这会引起其他问题(但需要很长时间才能解释原因)。
感谢 - Gaweyne 编辑:如果纯CSS不可能,那么我接受使用JavaScript或JQuery的解决方案,不需要下载其他插件。
each
方法没有任何作用。它将80
传递给expandingTextBox(e)
,而函数内部的$(e)
将返回一个空集合。 - Rick Hitchcockdisplay
、height
、-moz-appearance
、-moz-binding
、resize
和许多其他属性,但是我无法改变高度。是什么导致可编辑div(或pre)出现问题? - Mr Lister