KindEditor 是一套開源的線上HTML編輯器,後臺可與 Java、.NET、PHP、ASP 等程式整合。為實現圖文混排的編輯效果，我們通常都會用到編輯器的圖片上傳功能，本文會簡單講一下KinEditor的基本使用，主要說明如何在php環境下，整合編輯器的圖片上傳功能！

1. KindEditor 官方下載：http://kindeditor.net/down.php
2. KindEditor 編輯器的基本使用：http://kindeditor.net/docs/usage.html
3. KindEditor 初始化引數配置：http://kindeditor.net/docs/option.htm
4. KindEditor 官方案例: http://kindeditor.net/demo.php
5. KindEditor在php環境下上傳圖片功能整合
   

首先，我們先看一下編輯器裡面自帶的圖片上傳彈框，編輯器可使用 網路圖片 和 本地上傳 種方式，如下圖。網路圖片地址在 file_manager_json.php 裡面設定，本地上傳的圖片上傳的資料夾在upload_json.php 裡面設定，如何設定接下來會有說明。

下面，我們就開始整合圖片上傳功能吧。

1）根據上述步驟引入css和js，同時初始化編輯器。

/* 頁面已引入以下檔案
 *	css: kindeditor/themes/default/default.css
 *	js: kindeditor/kindeditor-all-min.js
 *		 kindeditor/lang/zh-CN.js
 */
 
 // 初始化編輯器
 KindEditor.ready(function(K) {
 editor = K.create('textarea[name="content"]',{
  autoHeightMode : true,// 需自動調整高度時配置
  resizeType: 1,//拖拽設定，詳情參考上述第3點，初始化引數配置
  allowImageUpload: true,// 允許圖片上傳
  allowFileManager: true,// 允許檔案管理
  wellFormatMode: false,// 不美化HTML資料，kindeditor會自動美化編輯器的html程式碼，這樣我們輸入內容之後生成的html會多很多的<br/>標籤，如不需要可將此配置項設定為false.
  uploadJson: 'kindeditor/php/upload_json.php',// 配置檔案上傳的介面檔案的路徑，需要使用 本地上傳 圖片時需配置
  fileManagerJson : 'kindeditor/php/file_manager_json.php',// 配置網路圖片載入的介面檔案的路徑，需要使用 網路圖片 載入圖片時需配置
  afterCreate : function() {
   this.loadPlugin('autoheight'); // 需自動調整高度時使用
  },afterBlur: function(){ // 編輯器失去焦點時將資料同步到textarea
   this.sync(); // sync的詳細作用可參考上述第2點，編輯器的基本使用
  }
 });
})

2）修改KindEditor中的 upload_json.php 檔案，保證本地上傳檔案路徑的正確性。
在路徑 kindeitor/php/ 目錄下找到 upload_json.php 檔案，我們發現會有下面幾行程式碼：

//檔案儲存目錄路徑
$save_path = $php_path . '../attached/';
//檔案儲存目錄URL
$save_url = $php_url . '../attached/';
//定義允許上傳的副檔名
$ext_arr = array(
	'image' => array('gif','jpg','jpeg','png','bmp'),'flash' => array('swf','flv'),'media' => array('swf','flv','mp3','wav','wma','wmv','mid','avi','mpg','asf','rm','rmvb'),'file' => array('doc','docx','xls','xlsx','ppt','htm','html','txt','zip','rar','gz','bz2'),);

從上面程式碼可以看出，kindeditor本地上傳的圖片預設會上傳到 kindeditor/attached/ 下面，如果attached目錄不存在，則會上傳失敗。我們可以根據自身程式碼目錄指定本地上傳的目錄。

3）修改KindEditor中的 file_manager_json.php 檔案，保證網路圖片路徑讀取的正確性。
在路徑 kindeitor/php/ 目錄下找到 file_manager_json.php 檔案，我們會發現也有兩行與 2）中相似的程式碼：

//根目錄路徑，可以指定絕對路徑，比如 /var/www/attached/
		$root_path = $php_path . '../attached/';
		//根目錄URL，可以指定絕對路徑，比如 http://www.yoursite.com/attached/
		$root_url = $php_url . '../attached/';
		//圖片副檔名
		$ext_arr = array('gif','bmp');

網路圖片地址的預設路徑同樣是 kindeditor/attached/ ，我們可根據自身需要修改目錄。

到此這篇關於PHP環境下如何實現使用KindEditor編輯器上傳圖片的文章就介紹到這了,更多相關PHP KindEditor編輯器上傳圖片內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！