如何在HTML中嵌入一个文本域到另一个文本域中？

Question

如何在HTML中嵌入一个文本域到另一个文本域中？

11

有没有一种方法可以在另一个textarea块内嵌套一个textarea块，但不渲染内部的textarea，同时保留外部的textarea？我无法修改内部的textarea。也许在外部块中使用比textarea更好的东西。我需要提交其内容的东西在POST。将内部角括号转换为实体不是一个选项，因为我想保留外部textarea中的html。

非工作示例代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>Test Embedded textareas</title>
</head>
<body>
    <form method="POST">
        <textarea>
            Outside Textarea
            <textarea>Inside Textarea</textarea>
        </textarea>
        <input type="submit" value="Submit" />
    </form>
</body>
</html>

- John Scipione

2

你想用这个解决什么问题？ - Paul Sasik

1

我正在创建一个 HTML 表单，用于编辑文本区域内的 HTML 代码。但是文本区域破坏了我的表单。 - John Scipione

你为什么不能像WordPress编辑器一样使用制表符？ - tawfekov

5

你的意思是你希望文本“<textarea>...</textarea>”被渲染在一个文本框标签内，还是你现在感到头疼得要爆炸了？ - aehiilrs

1

是的，那正是我的意思。我正在尝试编辑HTML文本区域内的HTML代码。我正在编辑位于HTML表单内部的文本区域中的HTML。头炸开了 - John Scipione

通过样式设计？http://thetechawesomeness.ideasmatter.info/rapid-text-area-prototype.html - Oleksii Kyslytsyn

10个回答

3

我曾经成功地将文本区域（textarea）包裹在段落标签中。以下是对我有效的方法：

<p style="margin:0;"><textarea rows="1" readonly="readonly" id="summary" name="Summary" ></textarea></p>

<p><textarea name="Note"></textarea></p>

这个对我没用：

<p><textarea rows="4" name="In_Honor_Address" class="blockInput"></textarea></p>

我还没想清楚其中一个工作的不同之处，但值得一试。

- Kevin

2

不行。在文本区域内，唯一有效的内容是文本。它就是一个文本区域。 :-)

- Jesse Weigert

1

我只想在我的文本区域中放置文本，特别是文本</textarea>，但它不允许我这样做！ - John Scipione

2

不，你试图将文本</textarea>放在你的文本区域中。排除这些实体是编码存在的意义。 - eaolson

1

这是您的解决方案：

将所有的 < 和 > 替换为 <。

&lt; and &gt;

- Jesse

这是不正确的，因为问题评论表明他实际上想要在另一个“textarea”内部拥有一个完全功能的“textarea”。 - Yi Jiang

1

为什么？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>Test Embedded textareas</title>
</head>

<style type="text/css">
    #outside { position:absolute; top:0; left:0; z-index:0; width:400px;
        height:400px }
    #inside  { position:absolute; top:100px; left:100px; z-index:1; 
        width:200px; height:200px; }
</style>

<body>

    <div>

        <textarea id="outside" rows="10" cols="80">
            Outside Textarea
        </textarea>

        <textarea id="inside" rows="5" cols="60" readonly>
            Inside Textarea
        </textarea>

    </div>

</body>
</html>

- Sinan Ünür

做得很好，但不太好，内部文本区必须在外部块内，并且不能修改内部文本区。 - John Scipione

由于 http://thetechawesomeness.ideasmatter.info/rapid-text-area-prototype.html - Oleksii Kyslytsyn

1

我实际上遇到了这个问题，因为我通过网站上的文本区编辑我的模板，当然我想在网站上有一个文本区...。我的解决方案是，在显示用于编辑的文本区中的文本时，我将字符串替换为/textaerea到/textarea placeholder，然后在提交更新数据库之前，我简单地进行反向操作，所以/textarea或/textarea placeholder将是正确的，并且将显示编辑器中的所有内容，而不是在第一次出现/textarea时关闭编辑器。此外，显示HTML实体确实会减少HTML的编辑，这就是我采用替换方法的原因。

- Radium Chris

0

试试这个：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>Test Embedded textareas</title>
</head>
<body>
    <textarea>
        Outside Textarea

    </textarea>
<textarea style="margin-top:-250px; height:250px;">Inside Textarea</textarea>
</body>
</html>

- CodeJoust

在Firefox 3.5中对我没用。另外，我忘了提到我不想修改文本区域内部。我会编辑问题以澄清。 - John Scipione

0

最近我遇到了同样的问题，在网上搜索了很久后，我通过将内部表单放入无缝的iframe中解决了它。

- mike

0

尝试使用隐藏表单字段。

- Daniel A. White

0

你考虑过使用FckEditor吗？

- Paul Sasik

是的，我考虑过使用像FckEditor这样的编辑器，但我不想要所见即所得编辑器。我只想在HTML文本区域内使用一个简单的老式纯文本编辑器。不过，我正在使用EditArea JavaScript来为HTML代码添加样式。在这里查看：http://www.cdolivet.com/index.php?page=editArea - John Scipione

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Chetan S · Accepted Answer

兄弟，真的，编码 HTML 是唯一的选择。一旦发布后，您可以在服务器端代码中解码它/进行任何操作。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>Test Embedded textareas</title>
</head>
<body>
    <form method="POST">
        <textarea>
            Outside Textarea
            &lt;textarea&gt;Inside Textarea&lt;/textarea&gt;
        </textarea>
        <input type="submit" value="Submit" />
    </form>
</body>
</html>