`
webook_java
  • 浏览: 58993 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类

ckeditor启动和销毁

 
阅读更多
ckEditor.js
//编辑器工作模式判断  
function isWysiwygareaAvailable() {  
    if (CKEDITOR.revision == ('%RE' + 'V%')) {  
        return true;  
    }  
    return !!CKEDITOR.plugins.get('wysiwygarea');  
}  
//启动ckeditor编辑页面区块  
function htmlCkeditor(id) {  
    var obj = $('#' + id);  
    var editor;  
    if (CKEDITOR.env.ie && CKEDITOR.env.version < 9)  
        CKEDITOR.tools.enableHtml5Elements(document);  
  
    CKEDITOR.config.height = obj.height();  
    CKEDITOR.config.width = obj.width();  
  
    var wysiwygareaAvailable = isWysiwygareaAvailable();  
  
    var editorElement = CKEDITOR.document.getById(id);  
  
    if (wysiwygareaAvailable) {  
        editor = CKEDITOR.replace(id);  
    } else {  
        editorElement.setAttribute('contenteditable', 'true');  
        editor = CKEDITOR.inline(id);  
    }  
    var cssFiles = document.getElementsByTagName('link');  
    var css = [];  
    for (var i = 0; i < cssFiles.length; i++) {  
        var file = cssFiles[i];  
        css.push(file.href);  
    }  
    editor.config.contentsCss = css;  
    return editor;  
}  
//启动编辑模式  
var selectEditElement, oldCss, oldZindex;  
function startEditModel() {      
    $(document).unbind("click");  
    $(document).bind("click", function (e) {  
        var curr = e.originalEvent.srcElement;  
        if (selectEditElement != curr && curr.id != 'btnEditorModel') {  
            $(selectEditElement).css('border', oldCss).css('z-index', oldZindex);  
            oldCss = $(curr).css('border');  
            oldZindex = $(curr).css('z-index');  
            $(curr).css('border', '1px dotted red').css('z-index', '9995').on('dblclick', function () {  
                this.id = this.id || 'ck_' + (new Date().getTime());  
                htmlCkeditor(this.id);  
            });  
            selectEditElement = curr;  
            e.stopPropagation();  
        }  
    });  
}  
//终止编辑模式  
function endEditModel() {  
    //解除页面文档的点击事件绑定  
    $(document).unbind("click");  
    //还原选中的页面区块样式  
    $(selectEditElement).css('border', oldCss).css('z-index', oldZindex);  
    for (var editor in CKEDITOR.instances) {  
        //还原编辑器覆盖的区块  
        $('#' + editor).css({ visibility: '' }).show();  
        //还原编辑器覆盖的区块  
        $('#' + editor).unbind("dblclick");;  
        //销毁编辑器实例  
        CKEDITOR.remove(CKEDITOR.instances[editor]);  
        //移除编辑器Jquery对象  
        $('#cke_' + editor).remove();  
    }  
}  

//处页面表单提交值
for (instance in CKEDITOR.instances){

            CKEDITOR.instances[instance].updateElement();
}
}
分享到:
评论

相关推荐

    CKEditor实现本地视频和图片的上传功能

    CKEditor是一款广泛使用的开源富文本编辑器,它允许用户在网页上进行文本编辑,并提供了丰富的格式设置和多媒体插入功能。本教程将详细讲解如何在CKEditor中实现本地视频和图片的上传功能,而不依赖于kfinal这样的第...

    ckeditor 和 ckfinder集成,并解决ckeditor和jquery dialog冲突问题

    这篇博客文章“ckeditor 和 ckfinder集成,并解决ckeditor和jquery dialog冲突问题”主要探讨了如何将这两个组件整合在一起,以及如何处理可能出现的前端JavaScript库冲突。 首先,集成CKEditor和CKFinder的目的是...

    ckeditor和ckfinder

    CKEditor和CKFinder是两个在Web开发中广泛使用的工具,主要服务于富文本编辑和资源管理的需求。CKEditor是一款强大的开源JavaScript文本编辑器,而CKFinder则是一个与之配套的文件管理器,允许用户方便地上传、浏览...

    ckeditor4.2 自定义按钮和下拉框实现

    在本文中,我们将深入探讨如何在CKEditor 4.2版本中实现自定义按钮和下拉框的功能。CKEditor是一款强大的富文本编辑器,广泛应用于网页内容编辑,它提供了丰富的API和可扩展性,允许开发者根据需求进行定制。 首先...

    ckeditor5全屏按钮

    CKEditor 5全屏按钮的实现依赖于JavaScript和CSS技术。在代码层面,当用户点击全屏按钮时,编辑器会修改自身的CSS属性,如`position`、`height`、`width`以及可能的`z-index`,以达到全屏效果。同时,它还会动态处理...

    ckeditor4 行高插件

    在网页编辑器的发展中,CKEditor一直以其强大的功能和良好的用户体验而备受青睐。CKEditor4是其重要的一代产品,它提供了丰富的可扩展性,允许用户根据需求定制编辑器的功能。在众多的插件中,“行高插件”是一个...

    ckeditor及配置方法

    同时,通过阅读CKEditor的开发者文档和社区资源,你可以学习更多高级技巧和最佳实践。 总结,CKEditor是一个强大且灵活的富文本编辑器,通过合理的配置和API使用,可以轻松集成到你的项目中,提升用户体验。了解其...

    CKEditor 上传文件(Servlet实现)

    CKEditor 是一款强大的富文本编辑器,广泛应用于网站内容管理、博客系统和其他在线文本输入场景。在CKEditor 3.6.0版本中,它提供了文件上传功能,使得用户可以直接在编辑器内上传图片或其他文件,极大地提高了内容...

    ckeditor 行间距插件

    在网页编辑器领域,CKEditor 是一款非常知名的富文本编辑器,它提供了丰富的功能和高度的自定义性,使得用户可以方便地创建和编辑复杂的HTML内容。行间距(Line Height)是文本格式化中的一个重要元素,它决定了文本...

    ckeditor4音频视频上传自定义插件

    本文将深入探讨如何为CKEditor 4自定义音频和视频上传插件,以满足特定的媒体处理需求。 CKEditor 4音频视频上传插件的开发主要涉及以下几个核心知识点: 1. **CKEditor 4 API**:首先,我们需要熟悉CKEditor 4的...

    ckeditor和ckfinder简单功能

    【ckeditor和ckfinder简单功能】 在网页开发中,CKEditor和CKFinder是两个非常重要的工具,主要用于提升用户体验,特别是对于内容管理和编辑。CKEditor是一款强大的富文本编辑器,而CKFinder则是一个文件管理器,...

    ckeditor4.0 最新版本

    5. **性能优化**:CKEditor 4.0 进行了一系列性能优化,减少了内存占用,提高了编辑器的启动速度和运行效率,尤其在处理大量文本或复杂布局时更为明显。 6. **无障碍支持**:考虑到无障碍访问的重要性,CKEditor ...

    ckeditor数学公式编辑器

    "ckeditor数学公式编辑器"则是CKEditor的一个扩展插件,专门用于在文档中添加和编辑数学公式。 在Web教育、科研或技术文档编写中,数学公式是常见且重要的组成部分。传统的HTML和CSS并不支持复杂的数学公式展示,这...

    最新c#整合ckeditor+ckfinder示例

    1. `Global.asax`:这个文件定义了应用程序范围内的事件处理程序,例如应用程序启动、结束、会话开始和结束等,用于全局配置和处理。 2. `Default.aspx`、`About.aspx`:这些是ASP.NET的页面文件,分别代表默认首页...

    ckeditor-5 已增加调整行高

    ckeditor-5是互联网上广泛使用的文本编辑工具,它以其用户友好的界面和丰富的功能集而备受赞誉。这次更新为用户提供了更精细的文本格式控制,使得内容创作更加灵活,满足了不同场景下的排版需求。 首先,我们要明白...

    ckeditor 自定义上传图片

    在提供的文件列表中,我们可以看到`CKEditor.NETwithSamples.sln`和`CKEditor.NET.sln`这两个解决方案文件,这表明包含了ckeditor与ASP.NET集成的示例代码。`_Samples`目录下可能有更具体的例子,展示了如何实现图片...

    ckeditor上传截图和图片php

    本项目是关于如何配置CKEditor和CKFinder,实现在编辑器中上传图片和截图至远程服务器,并且能够直接将截图粘贴到编辑器内部。 首先,我们来看CKEditor。CKEditor提供了丰富的功能,包括字体设置、段落格式、链接...

    ckeditor-java-3.6.2

    CKEditor 3.6.2是该编辑器的一个特定版本,它在前一版本的基础上进行了优化和改进,以提升用户体验和功能。 CKEditor的主要特点包括: 1. **丰富的编辑功能**:CKEditor支持多种文本格式处理,如字体、字号、颜色...

    让ckeditor只读 让ckeditor只读

    把ckeditor 3.4的ckeditor.js复盖就行

Global site tag (gtag.js) - Google Analytics