自定义FCKeditor的图片上传功能

最新推荐文章于 2021-06-02 23:42:14 发布

aijun1982

最新推荐文章于 2021-06-02 23:42:14 发布

阅读量105

点赞数

分类专栏： java 文章标签： fckeditor HTML 浏览器

java 专栏收录该内容

27 篇文章 0 订阅

订阅专栏

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 ) ;

我们只需注释此类语句即可。