html - 使只读文本区域的高度由其内容决定

Question

我想让只读输入看起来像带有 CSS 的 pre 或 div 标签。

我原以为使用文本区域会很容易，但这似乎是一项艰巨的任务。我可以隐藏边框和调整大小，但无论出于何种原因，我都无法使文本区域的高度由其内容决定。

我看过很多关于使用 javascript 自动调整文本区域大小的资料，但是如果它是不需要 javascript 的静态文本，我能做些什么吗？

更新

我只是想澄清一下这样做的目的:我希望用 javascript 编写、重写并提交带有表单的单个只读元素，同时不将其限制在单个内联区域这充其量会强制滚动，更糟糕的是会导致数据丢失。

更新 2

根据要求，我创建了一个 fiddle 来展示我正在尝试做的事情的例子:http://jsfiddle.net/BUwdE/1/ .

textarea[readonly] {
    width: 100%;
    border: 0;
    resize: none;
    overflow: hidden;
}

您会看到底部的内容被截断了，因为文本区域的高度不是由其内容决定的。

Answer 1

我实际上尝试做你一直在做的事情。但由于它将是一个只读 输入，我实际上最终将 CSS 应用于 div 元素。这将是一个让我们头疼的 hack。

HTML

<div class="faketextarea"> some long long text </div>

CSS

.faketextarea {
   // css of a text area 
}