thinkphp 编辑器kindeditor
首先,去官网下载最新版的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
<link rel="stylesheet" href="__PUBLIC__/editor/themes/default/default.css" />
<link rel="stylesheet" href="__PUBLIC__/editor/plugins/code/prettify.css" />
<script charset="utf-8" src="__PUBLIC__/editor/kindeditor.js"></script>
<script charset="utf-8" src="__PUBLIC__/editor/lang/zh_CN.js"></script>
<script charset="utf-8" src="__PUBLIC__/editor/plugins/code/prettify.js"></script>
<script>
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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
{$usejs}
</head>
<body>
<form name="example" method="post" action="__URL__/php">
<?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 //获取编辑器的内容
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
{$a}
</body>
</html>
thinkphp 编辑器kindeditor的更多相关文章
- 富文本编辑器kindeditor配置
<!--富文本编辑器kindeditor配置↓ --> <link type="text/css" rel="stylesheet" href ...
- easyUI整合富文本编辑器KindEditor详细教程(附源码)
原因 在今年4月份的时候写过一篇关于easyui整合UEditor的文章Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合,从那 ...
- 后台文本编辑器KindEditor介绍
后台文本编辑器KindEditor介绍 我们在自己的个人主页添加文章内容的时候,需要对文章内容进行修饰,此时就需要文本编辑器助阵了! 功能预览 KindEditor文本编辑器 KindEditor文本 ...
- python 全栈开发,Day83(博客系统子评论,后台管理,富文本编辑器kindeditor,bs4模块)
一.子评论 必须点击回复,才是子评论!否则是根评论点击回复之后,定位到输入框,同时加入@评论者的用户名 定位输入框 focus focus:获取对象焦点触发事件 先做样式.点击回复之后,定位到输入框, ...
- 使用富文本编辑器Kindeditor
今天在做需求的时候,遇到有一个字段,需要保存带有格式的内容,决定使用富文本框编辑器Kindeditor来实现,解决方法如下: 登录官网下载控件包: http://kindeditor.net/down ...
- 富文本编辑器 KindEditor 的基本使用 文件上传 图片上传
富文本编辑器 KindEditor 富文本编辑器,Rich Text Editor , 简称 RTE , 它提供类似于 Microsoft Word 的编辑功能. 常用的富文本编辑器: KindEdi ...
- Thinkphp编辑器扩展类kindeditor用法
一, 使用前的准备. 使用前请确认你已经建立好了一个Thinkphp站点项目. 1,Keditor.class.php和JSON.class.php 是编辑器扩展类文件,将他们拷贝到你的站点项目的Th ...
- 纯JS文本在线HTML编辑器KindEditor
KindEditor(http://www.kindsoft.net)是一款比较专业,主流,好用的在线HTML编辑器. 它除了可以将文本进行编辑.将Word中的内容复制进来外,本身还可以拖动缩放(右下 ...
- HTML编辑器KindEditor
KindEditor 是一套开源的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果,开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富文本 ...
随机推荐
- BZOJ 2395 [Balkan 2011]Timeismoney(最小乘积生成树)
[题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=2395 [题目大意] 给出一张无向图,每条边上有a,b两个值,求生成树, 使得suma* ...
- 【高精度】【找规律】Gym - 101243B - Hanoi tower
题意:给你一个经典的汉诺塔递归程序,问你最少几步使得三个柱子上的盘子数量相同.(保证最开始盘子数量可以被3整除) 规律:ans(n)=2^(2*n/3-1)+t(n/3). t(1)=0. t(n)= ...
- zigbee控制ADAM4150
任务名称:zigbee节点控制ADAM4150 实验现象:通过zigbee节点上的节点控制ADAM 注意点:控制ADAM4150的波特率必须是9600,否则会出现错误 核心代码 1.寄存器配置 voi ...
- Ubantu配置protoc2.5.0
首先得到 protobuf 相应的包文件 ,在终端上输入如下 wget http://protobuf.googlecode.com/files/protobuf-2.5.0.tar.gz 下载完毕后 ...
- linux安装Node(Centos)
步骤 1.打开node官网,找到node版本的下载地址 这里我找到的地址是: https://npm.taobao.org/mirrors/node/v8.2.1/node-v8.2.1-linux- ...
- 关于XUtils框架细解
感谢关注xUitls的网友最近一段时间给予的热心反馈,xUtils近期做了很多细节优化之后,功能和api已经稳定. 1.9.6主要更新内容:Bitmap加载动画有时重复出现的问题修复,加载过程优化; ...
- Oracle 11gR2 RAC 数据库不能连接(ORA-12537: TNS:connection closed)
Oracle 11gR2 RAC 数据库不能连接(ORA-12537: TNS:connection closed)的解决 [oracle@rac01 ~]$ sqlplus /nolog SQL*P ...
- jquery next()方法
1.html代码 <!DOCTYPE html> <html> <head> <script type="text/javascript" ...
- 如何破解linux用户帐号密码一
ENCRYPT_METHOD SHA512 定义帐号密码的加密方式 1.第一步拿到散列,也就是加密后的密码hash值 2.可以去一些彩虹表(rainbow)网站查询这些hash对应的密码明文,稍微花些 ...
- 通过HTTP发包工具了解HTTP协议
一.HTTP.pl功能简介 HTTP.pl perl编写的发包工具,简化版本curl,像curl致敬(唉,“致敬”都被于妈玩坏了). 该发包工具支持HEAD,GET,METHOD三种基本请求方法, ...