在 textarea 中包含 html 页面答案

【问题标题】：Include html page in textarea在 textarea 中包含 html 页面
【发布时间】：2016-04-02 01:56:32
【问题描述】：

我正在尝试创建一个可以编辑 html 文件文本的管理平台。

为此，我制作了另一个页面，我认为我可以将整个 html 文件加载到 textarea 中。

我为此使用 Thymeleaf 和 Spring。而且我不希望在 textarea 内呈现 html 文本（stackoverflow 中关于此的大多数问题都希望呈现 html）。

这是一个例子：

页面（文本）我想在文本区域内：
index.html：

    <!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <title>Login</title>
        <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}"
              href="../../static/public/css/bootstrap.min.css" />
    </head>
    <body onload="document.f.username.focus();">
        <div class="container">
            <div class="navbar">
                <div class="navbar-inner">
                    <a class="brand" href="http://www.thymeleaf.org"> Thymeleaf -
                        Plain </a>
                    <ul class="nav">
                        <li><a th:href="@{/}" href="home.html"> Home </a></li>
                    </ul>
                </div>
            </div>
            <div class="content">
                <p th:if="${param.logout}" class="alert">You have been logged out</p>
                <p th:if="${param.error}" class="alert alert-error">There was an error, please try again</p>
                <h2>Login with Username and Password</h2>
                <form id="login" name="login" th:action="@{/j_spring_security_check}" action="/doLogin" method="POST">
                    <fieldset>
                        <input type="text" name="username" value="" placeholder="Username" />


    <input type="password" name="password" placeholder="Password" />
                </fieldset>
                <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}" />
                <input type="submit" id="login" value="Login" class="btn btn-primary" />
            </form>
        </div>
    </div>
</body>

我希望用户能够准确地编辑它，所以我想在 texarea 中包含这样的文本：

<div class="content">
                <h1>Editing page index.html</h1>
                <h2>HTML code: </h2>
                <textarea th:text="${param.clic[0]}">//Here is where i need help
                </textarea>
            </div>

有可能做我想做的事吗？

感谢您的帮助！如果您需要更多详细信息，我很乐意提供给他们

【问题讨论】：

Textarea elements 没有文本属性。您不妨试试th:value 或th:defaultValue。
取消，抱歉。我刚刚发现 th:text 在标签之间插入文本的位置。
@Traktor53 是的，谢谢。 Thymeleaf 会帮我处理。
我尝试使用 th:include 而不是 th:text，它确实向我显示了页面，但是它忽略了原始页面中的 th 标签。有什么想法吗？
如何将 html-text 从控制器传递到视图？

标签： javascript html spring thymeleaf

【解决方案1】：

您可以尝试对带有 html 的文本使用 th:utext 标记。

这是官方文档 - unescaped text

【讨论】：

试过了，没有我要的功能

【解决方案2】：

使用 th:text 和 th:utext 都没有解决问题，但是我所做的是将 document.html 作为文本文件读取到 java 上，然后将文本放在 textarea 上。我使用了大部分发布在的代码：http://www.mkyong.com/java/how-to-read-file-from-java-bufferedreader-example

这里我把我的完整代码留在 java 上：

@Value("${application.thymeleaf.templatesdir}")
    String path;
    @RequestMapping(method = RequestMethod.GET)
        public String home(Map<String, Object> model, HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            //Clic is added as parameter on the url
            String documento = path + request.getParameter("clic") + ".html";
            StringBuilder cad = new StringBuilder();

        BufferedReader br = null;

        try {

            String sCurrentLine;

            br = new BufferedReader(new FileReader(documento));

            while ((sCurrentLine = br.readLine()) != null) {
                cad.append(sCurrentLine + "\n");
            }

        } catch (IOException e) {
            //Exception...
        } finally {
            try {
                if (br != null) {
                    br.close();
                }
            } catch (IOException ex) {
                //Error
            }
        }

        model.put("text", cad.toString());
        return "admin/editaUnaPagina";

在 HTML 上我有这个：

<form th:action="@{/saveHtml}" method="POST">
                    <h2>HTML code:</h2>
                    <textarea class="textarea" th:text="${text}" name="text">
                    </textarea>
                    <input type="submit" value="SAVE"/>
                    <input type="hidden" name="clic" th:value="${param.clic[0]}" />
                    <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}" />
</form>

java 代码中的“clic”参数与文档名称完全相同。

application.thymeleaf.templatesdir 的值是我在 application.properties 上建立的，它看起来像这样：

application.thymeleaf.templatesdir = 资源/模板/

【讨论】：