前不久很荣幸给我27期战友沟通 FCKeditor这个编辑器的使用情况,在那之前我从来没有接触过这个东西,现在好了,至少我会用了。所以在这里就给大家介绍一下这个小玩意,总体来讲此物一点都不难。当然我说的是老版本,至于新版本我就不敢吹嘘了,因为新版本开始不再完全
开源,像图片等上传等插件开始收费了,我们可以
下载插件来实现,不过我不太熟。所以就不蒙骗大家了,如果您感兴趣可以自己去网上搜索,我想百度比我牛多了。不说废话了进入正题之前我已经把所有此物以及实例还有PPT以及我的源
代码还有从官方下的最新版本和老版本都已经打包放到附件里,以供大家下载使用。
这是最新版的样式:
新版
这是我的案例,
源代码是压缩包里的ck,
解压后里面有详细向导教你如何去配置,在此我不多讲,大概就是
有一个自己建的文件夹,比如ck,然后把ckeditor编辑器解压到这个文件夹里。
再在ck里自己建个文件,比如index.php用来调用编辑器,再建一个check.php来接收index.php传输过来的值,让它显示或者插入数据等操作。
目录结构如下:
目录
==================================================================================
index.php我们做如下配置和调用编辑器,就几步,简单。代码如下:
- <body>
- <form action="check.php" method="post">
- <p>
- 标题:<input type="text" name="title"/>
- <p>
- <?php
- //只要包含一下就OK,很简单
- include("ckeditor/ckeditor.php");
-
- //先实例化一下,你懂的
- $ckeditor = new CKEditor();
- //这里的路径前面不要有 / ,如果你写成'/ckeditor/'那就掉不出来了
- $ckeditor->basePath = 'ckeditor/';
-
- //定义宽度 默认100% ,定义高度也是这样写,只是把width改成height就OK了
- $ckeditor->config['width'] = 800;
- //这里是定义有哪些功能,默认就够咱用了
- //$ckeditor->config['toolbar'] = 'Basic';
- //定义输入框的大小
- $ckeditor->textareaAttributes = array("colos"=> 80,"rows"=>10);
- //输入框中默认值,随便写
- $defaultValue = '学习<font color="blue">CKEditor</font>工具';
- //好了这里就是我们把那个编辑器给调出来了
- $code = $ckeditor->editor("value",$defaultValue);
- ?>
- <p>
- <input type="submit" value="提交看结果"/>
- </p>
- </body>
-
- </html>
|
截图效果如下:
index.php截图
实现效果如上图二
==============================================================================
再来看看check.php中如何获取值的,代码如下:
- <body>
- <?php
- $title = $_POST['title'];
- $value = $_POST['value'];
-
- echo "标题:".$title."<br/>";
- echo "内容:".$value;
- ?>
- </body>
|
输出效果如下:只要你在编辑页编辑的样式,都能输出
输出结果
===========================================================================
插入数据的操作我简写一下吧
复制代码
- <body>
- <?php
- $link = mysql_connect('localhost','root',"123456");
- $db = mysql_select_db("add",$link);
- mysql_query("set names 'utf8'");
-
- $title = $_POST['title'];
- $value = $_POST['value'];
-
- //插入数据库
- $ins = "insert into text values (null,'".$value."',null)";
- $num = mysql_query($ins,$link);
-
- //从数据库查询,具体查询语句哥们自己写,都会写的
- //这里的id你要自己写语句取值,不再赘述,案例而已
- $sql = "select * from text where id=3";
- $s = mysql_query($sql);
- while($assoc = mysql_fetch_assoc($s)){
- $val = $assoc['text'];
- }
-
- ?>
-
- </body>
|
=-=-=-=-=-=-=-=-=-=-=-==-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-
就是这样了。如果想从数据库查询到的数据放到编辑器里,你就把查询的值赋给变量然后在加载编辑器的时候放到默认值的那个变量里就行了。
分享到:
相关推荐
FCKeditor是一款功能强大的开源在线文本编辑器(DHTML editor),它使你在web上可以使用类似微软Word 的桌面文本编辑器的许多强大功能
FCKeditor编辑器的精简教程手册,很实用,一步步挺详细的,祝大家学习进步,多交流技术啊!可下载直接打印。
兹将我的经验与体会描述如下:应用目的:将FCKeditor编辑器集成到Thinkphp中,使用户能够在线像编辑Word一样处理即将发表的文字与图像。 应用软件与环境:apache服务器2.0以上版本,PHP版本5.0以上,mysql5.0以上;...
功能强大的开源在线文本编辑器,可以解压后把相关内容放到asp.net网站目录下,可以实现类似word的编辑器,也可以插入图片和Flash。
1.支持XHTML 2.多语言 3.支持SKIN ...5.支持图片上传等功能 6.支持CSS样式 ...FCKEDITOR是使用JAVASCRIPT编写的面向对象的在线编辑器,它兼容各种浏览器 提供强大的功能和良好的可定制性,而且配置起来极为容易
Ueditor编辑器相对fckeditor编辑器操作更方便,源码更简洁。编辑内容时,不会生成多余的html标签,源码更简洁,提高了网站访问速度,优化代码,利于网站收录; 最新版Ueditor支持动态地图; 像操作word表格一样简单...
添加了导入word功能,实现上传word文档至编辑器中。
FCKeditor是一款功能强大的开源在线文本编辑器(DHTML editor),它使你在web上可以使用类似微软Word 的桌面文本编辑器的许多强大功能。它是轻量级且不必在客户端进行任何方式的安装。FCKeditor兼容 Firefox, Mozilla,...
开源的HTML文本编辑器可以让Web程序拥有如MS Word这样强大的编辑功能.经过本人测试修改,完整无错。内附实例。
主要用AjaxPro将Fckeditor编辑器中的HTML代码发送到后台用Regex查找图片用WebClient下载图片,替换图片链接,回发信息,替换Fckeditor编辑器中的代码来实现将复制到编辑器中的图片下载到本地文件夹中。
强大的富文本编辑器。 支持复制粘贴 支持图片插入,swf插入 支持word转html等功能
fckeditor 精简word拷贝代码插件
FCKeditor类似于WORD文档,可进行文档的编辑,编写博客等程序的时候可以用到
FCKeditor 这个开源的HTML 文本编辑器可以让web 程序拥有如MS Word 这样强大的编辑功能。FCKeditor 支持当前流行的浏览器如IE 5.5+, Firefox 1.0+, Mozilla 1.3+与Netscape 7+等。基本上我们需要的编辑功能它都能够...
废话不多说了,搞过web开发的人大概都知道FCKeditor是做为在线HTML编辑器的,类似于word的编辑试图和展现方式,实际上幕后依然是转成了HTML脚本的。因为笔者使用的是Java语言,所以开发环境也是基于Java的IDE,其他...
在线网页编辑插件(用浏览器编辑后所见即所得),支持多种平台下的脚本(asp ...这个开源的HTML文本编辑器可以让Web程序拥有如MS Word这样强大的编辑功能. FCKeditor支持当前流行的浏览器如IE,Firefox,Netscape,Opera等
实现了FCKeditor 与word的功能相当,实现了各种编辑功能。能对文字进行处理。与QQ空间留言板的功能一样。
在java的Web应用开发中,大量文本输入往往因缺乏像MSword一样的版面编辑功能,页面输出显得不够漂亮。最近几年虽然出现多款支持java的在线编辑器,但也是...为此,笔者对FCKeditor在线编辑器在java中的应用稍作介绍。
文件编辑框,一般都是用来做HTML编辑器,至于里面的各项功能,也是在编辑器内部使用,像word一样的编辑框