3

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

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

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

更新

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

更新 2

根据请求，我创建了一个小提琴来展示我正在尝试做的示例：http: //jsfiddle.net/BUwdE/1/。

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

您会看到内容在底部被截断，因为 textarea 的高度不是由其内容决定的。

4

2 回答 2

1

我实际上试图做你一直在做的事情。但由于它将是一个只读输入，我实际上最终将 CSS 应用于 div 元素。这将是一个解决我们头痛的问题。

HTML

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

CSS

.faketextarea {
   // css of a text area 
}
于 2020-06-24T09:49:45.363 回答
0

您可以使用 rows 属性在 HTML 中指定文本区域的高度，但这不会自动调整大小。你可能不得不求助于 W3C CSS 工作组来获得你想要的东西。

<textarea name="whatWillBeSentToServer" rows="4" readonly="readonly">
于 2013-11-20T23:39:59.123 回答