最近的專案中使用了KindEditor作為富文字編輯器進行文字編輯處理。KindEditor 是一套開源的線上HTML編輯器，主要用於讓使用者在網站上獲得所見即所得編輯效果，開發人員可以用 KindEditor 把傳統的多行文字輸入框(textarea)替換為視覺化的富文字輸入框。官網地址：http://www.kindsoft.net/。

KindEditor能夠進行圖片上傳，上傳完畢後可以馬上在文字編輯器中看到剛剛上傳的圖片，具體例項下載KindEditor之後，包裡面有一個demo，可以參考。

使用KindEditor上傳圖片，圖片上傳的路徑是由使用者自行指定的，KindEditor展示上傳的圖片時，需要一個路徑作為圖片img的src,這個路徑由處理圖片的JSP指定，當拼接好url之後，使用PageContext的getOut,獲取輸出流進行輸出：

 //傳送給KE，作為圖片路徑
        JSONObject obj = new JSONObject();
        obj.put("error", 0);
        obj.put("url", saveUrl + newFileName);
        
        out.println(obj.toJSONString());

insertimage : function(url, title, width, height, border, align) {
		title = _undef(title, '');
		border = _undef(border, 0);
		var html = '<img src="' + _escape(url) + '" data-ke-src="' + _escape(url) + '" ';
		if (width) {
			html += 'width="' + _escape(width) + '" ';
		}
		if (height) {
			html += 'height="' + _escape(height) + '" ';
		}
		if (title) {
			html += 'title="' + _escape(title) + '" ';
		}
		if (align) {
			html += 'align="' + _escape(align) + '" ';
		}
		html += 'alt="' + _escape(title) + '" ';
		html += '/>';
		return this.inserthtml(html);
	}