thinkphp編輯器kindeditor

wensongyu發表於2013-10-14

PHP

首先，去官網下載最新版的kindeditor，然後把裡面asp，jsp，net，example的全刪除，然後改名為editor放進public（最外層目錄的public）資料夾裡面

在目錄lib目錄建立ORG資料夾（個人習慣用ORG儲存公用類），建立一個共用類，editor.class.php

下面是這個類的具體程式碼

<?php

/*編輯器呼叫的初始化類

class editor {

var $Width;

var $Height;

var $Value;

/* 此方法是編輯器的構造方法

*第一個引數，$Height是高度，不填預設是500px

*第二個引數，$Width是寬度，不填預設是700px

*第三個引數，$Value是編輯器預設內容，不填預設是“<h2>歡迎使用編輯器</h2><br>”

function editor($Height=”500px”,$Width=”700px”,$Value=”<h2>歡迎使用編輯器</h2><br>”) {

$this->Value = $Value;

$this->Height = $Height;

$this->Width = $Width;

}

/*此方法是線上編輯器的呼叫

* 在需要編輯器的地方呼叫此函式

function createEditor(){

return “<textarea name=`content1` style=`width:$this->Width;height:$this->Height;visibility:hidden;`>$this->Value</textarea>”;

}

/*使用線上編輯器必須在html<head></head>之間呼叫此方法，才能正確呼叫，

* 內容主要都是script

function usejs(){

$str=<<<eot

KindEditor.ready(function(K) {

var editor1 = K.create(`textarea[name=”content1″]`, {

cssPath : `__PUBLIC__/editor/plugins/code/prettify.css`,

uploadJson : `__PUBLIC__/editor/php/upload_json.php`,

fileManagerJson : `__PUBLIC__/editor/php/file_manager_json.php`,

allowFileManager : true,

afterCreate : function() {

var self = this;

K.ctrl(document, 13, function() {

self.sync();

K(`form[name=example]`)[0].submit();

});

K.ctrl(self.edit.doc, 13, function() {

self.sync();

K(`form[name=example]`)[0].submit();

});

}

});

prettyPrint();

});

</script>

eot;

return $str;

}

/*取得線上編輯器的值並返回

function getEditorContent(){

$htmlData = “;

if (!empty($_POST[`content1`])) {

if (get_magic_quotes_gpc()) {

$htmlData = stripslashes($_POST[`content1`]);

} else {

$htmlData = $_POST[`content1`];

}

return $htmlData;

}

程式碼註釋都寫的比較清楚了，然後在action建立個檔案，是IndexAction.class.php

<?php

class IndexAction extends Action {

public function _initialize() {

header(“Content-Type:text/html; charset=utf-8”);

}

public function index(){

import(“@.ORG.editor”); //匯入類

$editor=new editor(); //建立一個物件

$a=$editor->createEditor(); //返回編輯器

$b=$editor->usejs(); //js程式碼

$this->assign(`usejs`,$b); //輸出到html

$this->assign(`editor`,$a);

$this->display();

}

public function php(){

import(“@.ORG.editor”);

$editor=new editor();

$a=$editor->getEditorContent(); //獲取編輯器的內容

$this->assign(`a`,$a);

$this->display();

// $this->success(`資料新增成功！`);

}

然後在tpl建立index資料夾，在裡面建立2個html檔案，

index.html //使用編輯器

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

<html>

<head>

<title>Insert title here</title>

{$usejs}

</head>

<body>

<?php //<textarea name=”content1″ style=”width:700px;height:200px;visibility:hidden;”></textarea> ?>

{$editor}

<br />

<input type=”submit” name=”button” value=”提交內容” /> (提交快捷鍵: Ctrl + Enter)

</form>

</body>

</html>

php.html //獲取編輯器的內容