【免费】Grails使用FCKEditor(附源码,有截图)资源-CSDN文库

共1143个文件

js：508个

gif：377个

html：138个

需积分: 0 93 浏览量更新于2009-06-05 收藏 3.14MB RAR 举报

**Grails框架与FCK Editor整合详解** 在Web开发中，富文本编辑器（Rich Text Editor）是必不可少的工具，它允许用户以类似Word的方式编辑网页内容。在Grails框架中，我们可以集成FCK Editor来提供这样的功能。FCK Editor是一款开源的、免费的JavaScript富文本编辑器，支持多种浏览器环境，提供了丰富的编辑功能。本文将详细介绍如何在Grails应用中使用FCK Editor，同时附带源码和操作截图，以帮助开发者快速理解和实现这一功能。 ### 1. 安装与引入FCK Editor 我们需要下载FCK Editor的源码包，并将其解压到Grails项目的web-app目录下的js或lib文件夹。这样，Grails在运行时可以自动加载所需的JavaScript和CSS文件。 ### 2. 创建Grails视图在Grails中，创建一个新的GSP（Groovy Server Pages）视图，用于展示FCK Editor。在视图文件中，我们需要引用FCK Editor的JavaScript文件，然后使用HTML代码来初始化编辑器。 ```html <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Grails FCK Editor示例</title> <script type="text/javascript" src="${resource(dir: 'js/fckeditor', file: 'fckeditor.js')}"></script> </head> <body> <textarea name="editor1" id="editor1" rows="10" cols="80"> 这里是默认的编辑器内容... </textarea> <script type="text/javascript"> var oFCKeditor = new FCKeditor( 'editor1' ) ; oFCKeditor.BasePath = "${resource(dir: 'js/fckeditor')}" ; // 设置编辑器的基础路径 oFCKeditor.Width = '100%' ; // 设置编辑器宽度 oFCKeditor.Height = '400px' ; // 设置编辑器高度 oFCKeditor.Value = "预设的编辑器内容" ; // 设置初始内容 oFCKeditor.Create() ; </script> </body> </html> ``` ### 3. 保存编辑器内容当用户完成编辑并提交表单时，我们需要在控制器中获取FCK Editor的内容。在Grails中，我们可以通过`params.editor1`来获取textarea中的值，即FCK Editor的内容。 ```groovy def save = { def content = params.editor1 // 将content保存到数据库或其他持久化存储中 // ... render view: 'success', model: [content: content] } ``` ### 4. 提供图片上传功能 FCK Editor允许用户上传图片，我们需要创建一个控制器处理图片上传请求，并返回图片的URL。在Grails中，我们可以使用`params.upload`来访问上传的文件，然后将其保存到指定的目录。 ```groovy def uploadImage = { def file = request.getFile('upload') if (file != null && !file.empty) { def filename = file.originalFilename file.transferTo(new File('public/images/' + filename)) render(text: "/images/${filename}", contentType: "text/plain") } else { render status: 400, text: '上传失败' } } ``` ### 5. 集成到Grails应用确保在Grails应用的配置文件中，允许静态资源的访问，以便FCK Editor的JavaScript文件能够正常加载： ```groovy grails.resources.mappings = { '/js/*' { resource(dir: 'js', includes: '*.js') } } ``` 通过以上步骤，你已经成功地在Grails应用中集成了FCK Editor，实现了富文本编辑功能。你可以根据实际需求进行定制，如添加更多插件，调整编辑器样式等。请注意，FCK Editor虽然功能强大，但已不再维护。在新的项目中，开发者可能更倾向于使用更新的富文本编辑器，如CKEditor或TinyMCE，它们提供了更好的性能和更多的特性支持。不过，了解如何在Grails中集成FCK Editor对理解Web应用的前端技术仍然具有一定的参考价值。

收起资源包目录

Grails使用FCK Editor(附源码,有截图) （1143个子文件）

spellchecker.cfm 6KB

fck_editor.css 8KB

main.css 5KB

tree.css 3KB

fck_internal.css 2KB

tree.css 2KB

fck_dialog.css 2KB

tree.css 2KB

fck_editorarea.css 2KB

browser.css 2KB

fck_dialog_common.css 2KB

fck_showtableborders_gecko.css 1KB

spellerStyle.css 888B

截图.doc 62KB

fck_strip.gif 4KB

loading.gif 3KB

logo_fckeditor.gif 2KB

spinner.gif 2KB

htm.gif 1KB

html.gif 1KB

htm.gif 1KB

html.gif 1KB

htm.gif 1KB

html.gif 1KB

rdp.gif 1KB

tmh.gif 1KB

tm.gif 1KB

tph.gif 1KB

tp.gif 1KB

ai.gif 1KB

embaressed_smile.gif 1KB

teeth_smile.gif 1KB

shades_smile.gif 1KB

tounge_smile.gif 1KB

wink_smile.gif 1KB

sad_smile.gif 1KB

regular_smile.gif 1KB

whatchutalkingabout_smile.gif 1KB

envelope.gif 1KB

heart.gif 1012B

thumbs_down.gif 992B

thumbs_up.gif 989B

kiss.gif 978B

fla.gif 946B

共 1143 条

资源推荐

资源评论

hbluojiahui

粉丝: 4
资源: 57

Grails使用FCK Editor(附源码,有截图)

微机原理循环程序设计，内有截图

Grails使用FCK Editor实例(附源码和文档)

grails-fck-editor-0.3.zip_grails_grails-fck-editor

Grails入门指南书籍和源码----下载不扣分，回帖加1分，欢迎下载，童叟无欺

Grails 入门指南+示例源码

grails-core源码

FCK editor 2.5.1 例子 源代码

grails使用freemarker.rar

grails 使用ajax的例子

grails开发

Grails Grails Grails

111D:\keke\grails指南\笔记\1111111.txt,grails 初学者，使用说明的。

使用 Grails 快速开发 Web 应用程序

Eclipse下搭建Grails项目

grails ckeditor 0.4修改支持flv插入

Grails从零开始开发项目二

使用Grails快速开发Web应用

grails-用户手册

grails中文使用手册

Grails 和 jQuery开发实例

Grails权威指南 Grails权威指南

eclipse开发grails插件

grails 开发框架-1

Grails开源框架 - 使用指南

grails快速开发web

Groovy和Grails配置方法

grails-2.4.4.zip

Grails plugin: Calendar

最新资源

FCK editor 2.5.1 例子源代码