1. 程式人生 > >ckeditor4.6.2上傳圖片thinphp3.3.2

ckeditor4.6.2上傳圖片thinphp3.3.2

1.首先下載ckeditor4.6.2

2.編輯器不提供直接選擇圖片上傳,我們先修改\plugins\image\dialogs模錄下的image.js搜尋“upload”可以找到這一段
id:'Upload',hidden:true

3.刪除image.js中d.config.image_previewText||"...",把這個引號裡的內容那個刪除,這引號的內容就是預覽框中的文字。

4.為編輯器設定上傳路徑

  方法一: 在html頁面,就是放編輯器的那個頁面,新增定義,就是圖片上傳到的路徑,“/控制器/方法名”

  CKEDITOR.replace( 'editor', {
         filebrowserImageUploadUrl  :  '{:U('Admin/img/ck_upload')}'
    });

  方法二:修改編輯器的config.js,加入config.filebrowserUploadUrl="上傳路徑";

5.在相對應的控制器下建立該方法 function ck_upload($ftype = 'image')
    {   
         $upload = new \Think\Upload();// 例項化上傳類
         $upload->maxSize   =     3145728 ;// 設定附件上傳大小
         $upload->exts      =     array('jpg', 'gif', 'png', 'jpeg');// 設定附件上傳型別
         $upload->rootPath  =      './Public/Uploads/'; // 設定附件上傳根目錄
         // 上傳單個檔案 
         $info   = $upload->uploadOne($_FILES['upload']); 
        if( $info){  
            $desname =$info['savepath'].$info['savename'];
            $previewname =" http://127.0.01/tym/Public/Uploads/".$desname;  
            $callback = $_REQUEST["CKEditorFuncNum"];  
            echo "<script             type='text/javascript'>window.parent.CKEDITOR.tools.callFunction($callback,'".$previewname."','');</script>";  
        }else{  
            echo "<font color=\"red\"size=\"2\">*檔案格式不正確(必須為.jpg/.gif/.bmp/.png檔案)</font>";  
        }  
    }