Fckeditor使用方法

Fckeditor使用方法Fckeditor使用方法

大家好,又见面了,我是你们的朋友全栈君。

       FCKEditor是一个专门使用在网页上的属于该房源代码的文字编辑器。它不需要太复杂的安装步骤即可使用,是一个轻量化的工具。可以和JavaScript、ASP.NET、JAVA、PHP等不同的编程语言结合。现在FCKEditor已经重新开发,并更名为CKEditor。

       在我们的程序中使用FCKEditor的具体方法为:

1.将解压后的FCKEditor整个文件夹复制到项目的WebRoot路径下。

2.在使用FCKEditor的页面导入fckeditor.js文件

<script language="javascript" src="${pageContext.request.contextPath}/fckeditor/fckeditor.js" charset="utf-8"></script> 

3.写一段JS代码,来显示FCKEditor

<script type="text/javascript">  
        $(function(){  
            var fck = new FCKeditor("content");//content为要替换的textarea的name属性  
            fck.Width = "99%";  
            fck.Height = "100%";  
            fck.ToolbarSet = "bbs";//指定工具栏的配置,bbs为我自己修改过的,如果不使用自定义配置文件,此处有Default,Basic两个选择  
            fck.BasePath = "${pageContext.request.contextPath}/fckeditor/";  
            fck.ReplaceTextarea();  
        });  
</script>  

        我们可以根据自己的需要来修改JS代码,实现自己想要的效果。

        因为我们有时候会涉及到数据的回显问题,一般我们都显示在textarea中,所以我们可以设置textarea的name属性和FCKEditor的content为相同的名称,这样我们在操作textarea的时候就像是在操作FCKEditor一样。

<textarea name="content" style="width:650px;height:200px"></textarea>  

        这样我们就实现了一个简单的页面编辑器的功能。

JS代码中各个参数具体作用(使用本js或者上文使用方法步骤3的代码都可以,两段代码大同小异)

<script type="text/javascript">  
  
        var oFCKeditor = new FCKeditor( 'content' ) ;//此参数会作为提交表单时的参数名  
        oFCKeditor.BasePath = "/fckeditor/" ;//一定要指定editor文件夹所在的路径,并且要以'/'结尾  
        oFCKeditor.Height   = 300 ;//高度  
        oFCKeditor.Value    = '' ;//默认的初始值  
        oFCKeditor.ToolbarSet="Basic";//指定工具栏的配置,默认为Default  
        //oFCKeditor.Create() ;//在当前位置生成并显示Fckeditor  
        oFCKeditor.ReplaceTextarea();//替换指定id或name属性的textarea为Fckeditor  
</script>  

使用自定义的配置文件

1.在fckconfig.js里将FCKConfig.CustomConfigurationsPath = ”修改为:  FCKConfig.CustomConfigurationsPath = FCKConfig.EditorPath + “myconfig.js”  作用:告诉Fckeditor,我有个自定义的配置在该地址下的该文件。

2.在myconfig.js里写想修改的东西,例如:表情,Fckeditor菜单栏的减少等,模版在fckconfig.js里面有,参考着修改即可。没有修改的配置,Fckeditor默认使用自己的默认配置。


版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/105684.html原文链接:https://javaforall.net

(0)
上一篇 2022年4月25日 上午8:20
下一篇 2022年4月25日 上午8:20


相关推荐

  • GPG error_gpt异常是什么意思

    GPG error_gpt异常是什么意思问题:sudoapt-getupdate时报错GPGerror解决方案://F42ED6FBAB17C654是根据你报错那一行确定的sudogpg–keyserverkeyserver.ubuntu.com–recvF42ED6FBAB17C654sudogpg–export–armorF42ED6FBAB17C654|sudoapt-keyadd-然后:sudoapt-getupdate…

    2022年10月13日
    5
  • js有几种数据类型?别再回答只有6种了![通俗易懂]

    js有几种数据类型?别再回答只有6种了![通俗易懂]关注公众号前端开发博客,回复“加群”加入我们一起学习,天天进步作者:_GeekWL链接:https://juejin.cn/post/6908990212236378120前端现在已经…

    2025年9月16日
    12
  • centos7安装python3.8_centos python3安装

    centos7安装python3.8_centos python3安装centos7自带版本是python2.7centos8是自带python3的如果要用的3.0以上的版本需要手动安装,下载地址:https://www.python.org/ftp/python/1、先查看系统python的位置在哪儿whereispythonpython2.7默认安装是在/usr/bin目录中,切换到/usr/bin/cd/usr/bin/llpython*从下面的图中我们可以看到,python指向的是python2,python2指向的是python2.7,因此

    2026年3月11日
    4
  • vue 引用网络css_Vue 引入外部CSS文件

    vue 引用网络css_Vue 引入外部CSS文件1 使用 import 引入缺点无法实现 scoped 且比价浪费资源请看以下代码 我们在一个 scoped 空间里引入外部 css 文件 exportdefaul name user import static css user css user content background color 3982e5 Add scoped attributetol

    2026年3月16日
    1
  • C语言中 malloc函数用法

    C语言中 malloc函数用法一、malloc()和free()的基本概念以及基本用法:使用malloc的情况 首先说明一下,由malloc动态申请的内存空间是堆式的内存空间。而静态的内存的空间是栈式的。有关堆栈的知识请参考其他相关资料。1. 大容量内存需求 a) 网上说当我们需要的内存空间超过0.5兆的时候最好使用动态内存,也就是利用malloc来申请内存空间。可以这么认为,如果内存过大,就会不

    2022年6月9日
    53
  • 四阶魔方用三阶魔方公式时,两个特殊情况处理方式(顶面十字、最后一步)

    四阶魔方用三阶魔方公式时,两个特殊情况处理方式(顶面十字、最后一步)四阶魔方的玩法比较简单的 就是把他变成三阶魔方 然后用三阶魔方公式还原 三阶魔方还原 一共只记 6 个公式即可 https blog csdn net Bob yuan article details 1 先按照面与面的对应关系 把 6 个面的中心 4 个块拼好 因为四阶魔方面与面的对应不是固定的 所以要看角块的颜色分布 来判断面与面对应关系 比如一个角块颜色是红 绿 黄 那

    2026年3月17日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号