1

我在使用带有 grails 的“tiny-mce”时遇到问题(textarea 显示不正确)。我正在使用 Eclipse Indigo,并使用“grails install-plugin tiny-mce”安装了 tiny-mce 插件。我写的代码是:

<!doctype html>
<html>
<head><title>TinyMCE Test</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <tinyMce:resources />
    <tinyMce:importJs/>
</head>

<body>
        <tinyMce:renderEditor type="advanced"/>

</body>

</html>

问题是显示的textarea 没有tiny-mce 功能,即所有可用于格式化文本的漂亮属性/按钮。textarea 只是一个简单的 html textarea。看起来检查生成的源代码(即右键单击->查看源代码)可能有一些问题:

<!doctype html>
<html>
<head><title>TinyMCE Test</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>    
    <script type="text/javascript" src="/MyGrailsProject/static/plugins/tiny-mce-    3.4.9/js/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
     <script type="text/javascript" src="/MyGrailsProject/static/plugins/tiny-mce-3.4.9/js/tinymce/jscripts/tiny_mce/tiny_mce.js"></script><script type="text/javascript">tinyMCE.init({
                            mode : "textareas",
                            theme : "simple",
                            editor_selector : "mcesimple",
                            theme_advanced_toolbar_location : "null"
                        });tinyMCE.init({
                            mode : "textareas",
                            theme : "advanced",
                            editor_selector : "mceadvanced",
                            theme_advanced_toolbar_location : "top"
                        });</script>
</head>
<body>
<textarea class='null mceadvanced'></textarea>
</body></html>

看起来 textarea 类有一个空值。这个对吗?有谁知道为什么我的 textarea 渲染不正确?问题是否与找不到文件“tiny_mce.js”有关?如果是这种情况,我该如何解决这个问题?

最好的问候克莱

4

6 回答 6

2

好的,所以我通过执行以下操作来完成这项工作:

  1. 从http://www.tinymce.com/download/download.php下载 tinymce => 给你一个文件 ~/tinymce
  2. 将 ~/tinymce 复制到 /web-apps/js/tiny_mce
  3. 在 main.gsp 中添加<g:javascript src="tiny_mce/tiny_mce.js"/>这将拿起 web-apps/js 文件夹下的文件夹
  4. 在这一点上,微型 mce 仍然无法工作。它会抱怨 en.js 和 editor_template.js
  5. 你必须去 Config.groovy 并添加这一行
    grails.resources.adhoc.excludes = ['/js/tiny_mce/**/*.*']
  6. 现在回到 gsp,添加 tiny_mce.init() 行 ex

    tinyMCE.init({
        theme : "advanced",
        mode : "textareas",
        plugins : "fullpage",
        theme_advanced_buttons3_add : "fullpage"
    });

    里面的<g:javascript>标签像

    <g:javascript>
    tinyMCE.init({
        主题:“高级”,
        模式:“文本区域”,
        插件:“整页”,
        theme_advanced_buttons3_add :“整页”
    });
    </g:javascript>
  7. 现在像往常一样添加文本区域<g:textArea name="..."/>

  8. 默认情况下,Grails 会在内部转义 html,${fieldValue(bean:...)}这样你漂亮的小 mce 标记就会被转义
  9. 将上面的内容更改为${object.field}和 ex:${person.firstName}就可以了。
于 2012-10-15T22:28:33.327 回答
1

TinyMCE Grails 插件不是必需的,目前已过期 3 个月您可以转至TinyMCE 的网站并在那里下载最新版本。

提取他们的 ZIP 文件并将文件夹复制tinymce\jscripts\tiny_mce到 Grails 项目的web-app文件夹下。(注意不要把它复制进去web-app\js,因为它是由Resources插件管理的,你需要在里面公开所有需要的静态资源ApplicationResources.groovy。)

然后在您的 .GSP 中,您<head>的页面部分中会有类似的内容:

<g:javascript src="../tiny_mce/tiny_mce.js"/>
<r:script>
    tinyMCE.init({
        mode: "textareas",
        theme: "advanced"
    });
</r:script>
于 2012-06-26T12:51:06.877 回答
1

让它工作的更简单的方法 - 在 html 头中包含 tinymce js

<head>
<script src="//tinymce.cachefly.net/4.0/tinymce.min.js"></script>
<script>
        tinymce.init({selector:'textarea'});
</script>
</head>

在 GSP 中有一个 textarea 元素('message' 是一个字段名称为 'content' 的命令对象)

<textarea  rows="10" name="content" >${fieldValue(bean:message,field:'content')}</textarea>

这是在 Grails 2.2 中测试的,而不是 CDN //tinymce.cachefly.net,tinymce js 文件可以放在 web-app/js 目录中并以更简单的方式包含在 GSP 中

于 2013-08-27T06:45:37.980 回答
0

如果您在 BuildConfig.groovy 中使用运行时 ":resources:1.1.6",而不是使用运行时 ':resources:1.2' 更新它。这对我来说很好。

于 2013-08-06T17:23:03.720 回答
0

需要找到“tiny_mce.js”才能使编辑器正常工作!确保在此处使用正确的路径。

于 2012-05-21T10:32:46.630 回答
0

您可以使用富 ui 插件进行富文本编辑器。

它非常简单和漂亮。

只需安装 ricuui 插件和

在头部添加资源。

像这样。

这进入头部

这进入身体-----

享受......

于 2012-06-05T07:58:13.563 回答