`
aijun980204
  • 浏览: 99382 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

自定义FCKeditor的图片上传功能

    博客分类:
  • java
阅读更多

fck_image.js

196行
function Ok(){}
// 图象插入“确定”按钮

203行
alert( FCKLang.DlgImgAlertUrl ) ;
// 当没有图象URL时提示“请输入图象地址”,这个值分别定义在语言文件夹对应的语言js文件中

269行
function UpdateImage( e, skipId ){}
// 更新、插入图象

    e.src = GetE('txtUrl').value ;
    SetAttribute( e, "_fcksavedurl", GetE('txtUrl').value ) ;
    SetAttribute( e, "alt"   , GetE('txtAlt').value ) ;
    SetAttribute( e, "width" , GetE('txtWidth').value ) ;
    SetAttribute( e, "height", GetE('txtHeight').value ) ;
    SetAttribute( e, "vspace", GetE('txtVSpace').value ) ;
    SetAttribute( e, "hspace", GetE('txtHSpace').value ) ;
    SetAttribute( e, "border", GetE('txtBorder').value ) ;
    SetAttribute( e, "align" , GetE('cmbAlign').value ) ;

// 分别设置图象的各个属性值,这些属性分别对应fck_image.html中的各个文本输入框的ID。


281行
    // Advances Attributes

    if ( ! skipId )
        SetAttribute( e, 'id', GetE('txtAttId').value ) ;

    SetAttribute( e, 'dir'        , GetE('cmbAttLangDir').value ) ;
    SetAttribute( e, 'lang'        , GetE('txtAttLangCode').value ) ;
    SetAttribute( e, 'title'    , GetE('txtAttTitle').value ) ;
    SetAttribute( e, 'long

Desc'    , GetE('txtLongDesc').value ) ;

    if ( oEditor.FCKBrowserInfo.IsIE )
    {
        e.className = GetE('txtAttClasses').value ;
        e.style.cssText = GetE('txtAttStyle').value ;
    }
    else
    {
        SetAttribute( e, 'class'    , GetE('txtAttClasses').value ) ;
        SetAttribute( e, 'style', GetE('txtAttStyle').value ) ;
    }

// 对应“高级”选项卡的设置,在样式设置处并做了浏览器兼容判断


35-52行控制选项卡的显示

window.parent.AddTab( 'Info', FCKLang.DlgImgInfoTab ) ;

if ( !bImageButton && !FCKConfig.ImageDlgHideLink )
    window.parent.AddTab( 'Link', FCKLang.DlgImgLinkTab ) ;

if ( FCKConfig.ImageUpload )
    window.parent.AddTab( 'Upload', FCKLang.DlgLnkUpload ) ;

if ( !FCKConfig.ImageDlgHideAdvanced )
    window.parent.AddTab( 'Advanced', FCKLang.DlgAdvancedTag ) ;

// Function called when a dialog tag is selected.
function OnDialogTabChange( tabCode )
{
    ShowE('divInfo'        , ( tabCode == 'Info' ) ) ;
    ShowE('divLink'        , ( tabCode == 'Link' ) ) ;
    ShowE('divUpload'    , ( tabCode == 'Upload' ) ) ;
    ShowE('divAdvanced'    , ( tabCode == 'Advanced' ) ) ;
}

不 需要某个选项卡时只要注释掉相应代码即可 。

在fckeditorcode_id.js和 fckeditorcode_gecko.js中有一个设置图片上传窗口大小的代码:

new FCKDialogCommand('Image',FCKLang.DlgImgTitle,'dialog/fck_image.html',450,400)

这 两个文件在FCK主目录下的editor/js目录下。
new FCKDialogCommand('Image',FCKLang.DlgImgTitle,'dialog/fck_image.html',450,400)

修 改图片上传的界面:

文件:fck_image.html

控制“确定”与“取消”按 钮 的位置与样式:

文件:fckdialog.html   309~316行左右

去 掉 选项卡:35行左右

window.parent.AddTab( 'Info', FCKLang.DlgImgInfoTab ) ;

我 们只需注释此类语句即可。
分享到:
评论

相关推荐

    FCKeditor控件示例 上传文本,图片,原格式

    图片上传是FCKeditor的一个关键特性。通过内置的文件管理器,用户可以直接在编辑器中选择本地图片并上传至服务器。这通常涉及服务器端脚本处理文件上传,例如使用PHP、ASP.NET或Java。在"WebSite2"的示例中,可能...

    fckeditor 2.5 上传图片会自动改名

    总之,FCKeditor 2.5中图片上传自动改名功能虽然在一定程度上解决了文件名冲突的问题,但也给部分用户带来了不便。通过上述分析和建议,开发者可以根据实际需求灵活调整,以达到最佳的使用效果。

    FCKEDITOR JSP 上传图片

    本文将深入探讨如何配置FCKeditor以实现JSP页面的图片上传功能。 首先,我们需要了解FCKeditor的基本结构。FCKeditor的核心是一个JavaScript库,它在客户端运行,提供一个所见即所得的编辑界面。为了支持图片上传,...

    Fckeditor可上传图片

    以下是对Fckeditor及其图片上传功能的详细解析: 1. **Fckeditor基本介绍** Fckeditor是基于Web的WYSIWYG(所见即所得)编辑器,允许用户在浏览器环境下进行类似桌面应用程序的文字编辑工作。它提供了丰富的编辑...

    FCKEditor图片截取代码

    1. **FCKEditor图片上传流程** 在FCKEditor中,当用户选择图片上传时,编辑器会调用内置的文件上传处理程序。这个过程包括选择本地图片、上传到服务器、以及返回服务器响应的URL,以便在编辑器内显示。 2. **图片...

    fckeditor开发.net-Demo带上传图片功能

    这个"**fckeditor开发.net-Demo带上传图片功能**"的压缩包文件提供了在.NET环境中使用FCKeditor进行富文本编辑并实现图片上传的示例代码和资源。 1. **FCKeditor简介** FCKeditor是一个基于JavaScript的在线文本...

    fckeditor编辑器实例(上传图片,flash已测试没有问题)(.net开发)

    与图片上传类似,用户选择Flash文件后,编辑器会将其发送到服务器。服务器端处理文件并返回URL,编辑器将此URL插入到HTML代码中,以实现Flash的在线预览和发布。 **安全性考虑** 在使用FCKeditor的上传功能时,...

    FCKeditor.Net上传图片加水印

    接下来,我们将深入探讨FCKeditor.Net的基本原理,以及如何实现图片上传并添加水印。 1. **FCKeditor.Net介绍** FCKeditor.Net是一个开源的JavaScript富文本编辑器,它提供了一个在Web应用程序中创建和编辑HTML...

    fckeditor+swfupload+图片本地化

    总的来说,"fckeditor+swfupload+图片本地化"组合提供了一个完整的网页编辑和图片上传解决方案,适合需要在网站上提供内容编辑功能,并且需要对图片资源进行本地管理的开发者。通过配置fckeditor和swfupload,开发者...

    fckeditor 2.5.1(带远程图片保存)

    3. **C#后端处理**:在C#中,你需要创建一个HTTP处理程序(HttpHandler)或ASP.NET页面来处理图片上传请求。这个处理程序会接收到FCKeditor发送的POST请求,解析请求中的文件数据,保存到服务器的特定目录,并返回...

    常用插件 FCKeditor 自己可以修改图片字体

    在标题和描述中提到的“自己可以修改图片字体”,意味着FCKeditor支持用户自定义编辑器中的图像和字体样式。 首先,关于**图片修改**,FCKeditor提供了内置的图片管理功能。用户可以通过编辑器的图像插入工具上传...

    为fckeditor添加多文件批量上传组件

    为了扩展其功能,我们可以利用其API和插件系统,添加自定义的上传模块。 添加多文件批量上传组件通常包括以下几个步骤: 1. **选择上传组件**:有许多开源的多文件上传组件可供选择,如jQuery File Upload、...

    FCKeditor.Net水印功能源码

    在处理图片上传时,该文件可能会调用特定的函数来添加水印,这部分源码是实现水印功能的关键。通过分析这部分代码,我们可以了解如何在服务器端动态地在图片上添加水印,并将处理后的图片返回给编辑器。 FCKeditor...

    在Lotus中嵌入Fckeditor上传代码

    FCKeditor以其易于使用和高度自定义的特性,被广泛用于替换系统默认的上传控件,为用户提供更好的交互体验。 FCKeditor是一个JavaScript库,它可以被嵌入到各种Web应用中,包括Lotus Notes。它提供了丰富的文本编辑...

    struts2,fckeditor冲突解决

    总之,解决Struts2和FCKeditor的图片上传冲突,关键在于正确配置Struts2的Action、启用文件上传支持、处理文件保存逻辑,并提供合适的反馈给FCKeditor。同时,确保在整个过程中考虑到安全性,避免潜在的风险。

    fckeditor精简版(php),带本地上传功能。

    此外,其本地上传功能让用户可以直接在编辑器中上传图片和文件,大大提升了用户体验。 3. **本地上传功能**:在fckeditor精简版中,本地上传功能是核心特性之一。用户可以直接在编辑器界面上选择本地计算机上的文件...

    fckeditor(支持上传附件)

    fckeditor的上传附件功能是其核心特性之一,允许用户在编辑内容时直接插入本地文件,如图片、文档或任何其他类型的支持文件。这一特性极大地增强了在线内容创作的便捷性,用户无需离开编辑器界面即可完成文件上传,...

    fckeditor2.6.4上传中文名问题解决方案

    这可能包括检查编辑器的配置、编码设置,或者使用第三方库或插件来增强FCKeditor的文件上传功能。 对于文件 "MyFCK",如果它是压缩包中的内容,可能是一个自定义版的FCKeditor,或者是用于测试或演示如何解决中文名...

    FCKeditorFCKeditor是一个功能齐全,兼容良好和使用简单的所见即所得HTML文本编辑器。

    6. **API接口**:FCKeditor提供了丰富的JavaScript API,开发人员可以轻松地控制编辑器的行为,实现自定义功能,如预览、保存、上传文件等。 7. **源码查看与切换**:用户可以在所见即所得模式和源代码模式之间自由...

Global site tag (gtag.js) - Google Analytics