目次
Thinkphp编辑器扩展类kindeditor使用方法
ホームページ php教程 php手册 Thinkphp编辑器扩展类kindeditor使用方法

Thinkphp编辑器扩展类kindeditor使用方法

Jun 13, 2016 am 09:28 AM
説明書 編集者

Thinkphp编辑器扩展类kindeditor使用方法


一, 使用前的准备。
使用前请确认你已经建立好了一个Thinkphp网站项目。
1,Keditor.class.php和JSON.class.php 是编辑器扩展类文件,将他们复制到你的网站项目的ThinkPHP\Lib\ORG\Net 文件夹下。
2,editor文件夹是kindeditor的核心包。将其复制到你项目的Public文件夹下(和入口文件同级的那个Public),并在Public下再建立一个Upload文件夹,用于存放使用编辑器上传的图片。
3,KeditorAction.class.php是编辑器的上传图片功能和浏览远程图片功能,将其复制到你项目的lib\Action 文件夹下。

二, 对象的调用
在控制器方法中调用对象:

import("ORG.Net.Keditor");
$ke=new Keditor();
$ke->id="content";//指定textarea的id
$keshow=$ke->show();//生成js代码
$this->assign("keshow",$keshow);
$this->display();
ログイン後にコピー



在方法对应的模版文件中显示编辑器:

<html>
<head>{$keshow}</head><!--输出js,建议放在head-->
<body>

</body>
</html>
ログイン後にコピー


上面的是最简单的调用方法,扩展类还有很多属性和方法。要想实现更完美的功能,接着往下读。

三, 对象的属性
我把属性分为两种,一种是kindeditor自带属性,一种是扩展新增属性。如果你以前就使用过kindeditor,你应该知道kindeditor自身有id、items、width、height、afterCreate等等30个属性。这些属性现在可以用过php直接定义,比如定义id:$ke->id=”content”,定义宽度:$ke->width=”700px”; 我先说对象新增属性。
对象的新增属性:
1,jspath:定义kindeditor的核心js文件,默认值为/Public/editor/kindeditor.js ,如果你的editor文件夹没有放在Publib下需要指定此属性,如$ke->jspath=”/kind/ kindeditor.js”;
2,form:指定提交的表单(from)的id,默认为form1,这个属性是结合ctrl+enter提交功能使用的,比如有个你的编辑器放在表单id为 “formid”内,要实现ctrl+enter提交formid表单,需要定义$ke->form=”formid” 。 ctrl+enter提交功能还要设置其他属性,后面再讲解。
3,imgid:指定存放图片地址的隐藏域id,默认为img。编辑器每上传一张图片,会把图片地址存储到该隐藏域。在向数据库添加数据时,可以把此隐藏域中的数据也保存到数据库字段中,在删除数据时候,先读取数据库存放的图片地址,进行删除。删除过程只要调用对象的delimg方法即可,此方法后面详解。这样就达到删除内容同时删除图片的目的。
自带属性:
1,items:配置编辑器的工具栏,定义方法如
$ke->items=”['source', '|', 'fullscreen', 'undo', 'redo', 'print', 'cut', 'copy', 'paste']”;
我增加了little关键词,可以快速定义一个精简模型的编辑器,使用方法$ke->items=”little”;
2,afterCreate:设置编辑器创建后执行的回调函数,定义方法如
$ke->afterCreate=”function(id){
alert(‘成功创建’+id)
}”;
我增加了ctrlenter关键词,可以快速定义ctrl+enter提交表单,使用方法:
$ke->afterCreate=”ctrlenter”;
同时需要定义$ke->form=”formname”, formname换为你编辑器所在的表单id。
3,resizeMode:2或1或0,2时可以拖动改变宽度和高度,1时只能改变高度,0时不能拖动。定义方法如:$ke->resizeMode=1; 注意,数字类型的属性值不要放在引号中,如$ke->resizeMode=”1”;这么定义是错误的。
4,allowFileManager:true或false,true时显示浏览服务器图片功能(点击上传图片按钮可以看到此功能),定义方法如
$ke-> allowFileManager=ture;
注意,属性值为布尔值时不要放在引号中。
5,imageUploadJson指定上传图片的服务器端程序,默认值为 /index.php/Keditor/upload
6,fileManagerJson:指定浏览远程图片的服务器端程序,
默认值为/index.php/Keditor/filemanager
注:之前你复制过的KeditorAction.class.php就是供上传图片和浏览远程图片使用的。文件内的upload方法定义了上传图片处理过程,文件内的filemanager方法定义了浏览图片的处理过程。你可以在这两个方法上加入判断权限的代码,实现只有管理员才能上传图片或浏览图片。你也可以不使用默认的KeditorAction.class.php,自己定义上传处理过程和浏览图片处理过程,则是你需要重新定义imageUploadJson属性值和fileManagerJson属性值。 自定义处理过程,后面详解。
还有其他自带属性,我就不一一列举了。大家可以查看kindeditor官方文档
http://www.kindsoft.net/doc.php?cmd=config
注意,数字类型或布尔类型的属性值,不要放在引号内。其他属性值放在引号中,属性值的格式和kindeditor自身格式一样。



四 对象的方法。
1,upload,上传图片。此方法在编辑器上传图片处理过程中使用,使用方法:

import("ORG.Net.Keditor");
Keditor::upload(&#39;./Public/Upload/&#39;,&#39;/Public/Upload/&#39;,array(&#39;gif&#39;,&#39;jpg&#39;,&#39;jpeg&#39;,&#39;png&#39;,&#39;bmp&#39;),1000000);
ログイン後にコピー


upload方法有三个参数,依次是,“上传图片目录”,“图片显示地址”,“允许上传图片格式”,“允许的图片大小(单位kb)”
上传图片目录:默认值“./Public/Upload/”(注意Public前面有个“点”符号,是使用的相对地址,不可使用绝对地址),上传图片目录地址是相当于处理文件的。Thinkphp所有的代码都是通过入口文件运行的,所以这个地址其实是相对于入口文件的。
显示图片地址:默认值“/Public/Upload”(一般是绝对地址),假设我们上传了一张图片,服务器端生成的图片名为 12345.gif。上传会显示的图片地址则为/Public/Upload/12345.gif ,因为我们使用的是绝对地址,所以编辑器发布的内容不管在网站的哪儿,图片都能正常显示。
允许上传的图片格式:定义一个数组,默认值为array('gif','jpg','jpeg','png','bmp')
允许的图片大小:默认值为,1000000 ,单位是bk。
2,filemanager,浏览服务器的图片。此方法在浏览图片处理过程中使用。使用方法:

import("ORG.Net.Keditor");
Keditor::filemanager("./Public/Upload/","/Public/Upload/",array(&#39;gif&#39;,&#39;jpg&#39;,&#39;jpeg&#39;, &#39;png&#39;, &#39;bmp&#39;));
ログイン後にコピー


参数依次是:“浏览图片目录”,“图片显示地址”,“允许浏览的图片格式”,和upload方法一样,浏览图片目录是相对地址,图片显示地址是觉得地址。

3,delimg:删除通过编辑器上传的图片。此方法一般在你删除数据库数据时使用。

import("ORG.Net.Keditor");
Keditor::delimg($imgfield);
//$imgfield 一般是你数据库存放图片地址的字段。
ログイン後にコピー



4,show:返回生成的js代码。此方法一般在显示编辑器的控制器中使用。
show方法可以使用一个参数定义kindeditor自带属性。如:

import("ORG.Net.Keditor");
$ke=new Keditor();
$ke->show(“{
id : ”content”,
width: ‘700px’;
height : ”300px”;
imgid : ”img”
}”);
ログイン後にコピー


不建议用show传参方式定义kindeditor属性。show传参方式不能定义jspath和form两个新站属性,也不能使用little和ctrlenter关键词。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

DirectX修復ツールの使い方は? DirectX修復ツールの詳しい使い方 DirectX修復ツールの使い方は? DirectX修復ツールの詳しい使い方 Mar 15, 2024 am 08:31 AM

DirectX 修復ツールは専門的なシステム ツールであり、その主な機能は現在のシステムの DirectX 状態を検出することであり、異常が見つかった場合は直接修復できます。 DirectX 修復ツールの使い方がわからないユーザーも多いと思いますので、以下の詳細なチュートリアルを見てみましょう。 1. 修復ツール ソフトウェアを使用して修復検出を実行します。 2. 修復の完了後、C++ コンポーネントに異常な問題があることを示すメッセージが表示された場合は、[キャンセル] ボタンをクリックし、[ツール] メニュー バーをクリックしてください。 3. [オプション] ボタンをクリックし、拡張機能を選択して、[拡張機能の開始] ボタンをクリックします。 4. 拡張が完了したら、再検出して修復します。 5. 修復ツールの操作が完了した後も問題が解決しない場合は、エラーを報告したプログラムをアンインストールして再インストールしてみてください。

C言語プログラミングに必須のソフトウェア:初心者におすすめの優れたヘルパー5選 C言語プログラミングに必須のソフトウェア:初心者におすすめの優れたヘルパー5選 Feb 20, 2024 pm 08:18 PM

C言語は基本的かつ重要なプログラミング言語であり、初心者にとっては適切なプログラミングソフトウェアを選択することが非常に重要です。市場にはさまざまな C プログラミング ソフトウェアのオプションがありますが、初心者にとってはどれが自分に適しているかを選択するのは少し混乱するかもしれません。この記事では、初心者がすぐに始められ、プログラミング スキルを向上できるように、5 つの C 言語プログラミング ソフトウェアをお勧めします。 Dev-C++Dev-C++ は、無料のオープンソース統合開発環境 (IDE) であり、特に初心者に適しています。シンプルで使いやすい統合エディター、

HTTP 525 ステータス コードの概要: その定義と応用を調べる HTTP 525 ステータス コードの概要: その定義と応用を調べる Feb 18, 2024 pm 10:12 PM

HTTP 525 ステータス コードの概要: その定義と使用法を理解する HTTP (HypertextTransferProtocol) 525 ステータス コードは、SSL ハンドシェイク中にサーバーでエラーが発生し、安全な接続を確立できないことを意味します。 Transport Layer Security (TLS) ハンドシェイク中にエラーが発生すると、サーバーはこのステータス コードを返します。このステータス コードはサーバー エラー カテゴリに分類され、通常はサーバーの構成またはセットアップの問題を示します。クライアントが HTTPS 経由でサーバーに接続しようとすると、サーバーには

Baidu Netdisk の使用方法 - Baidu Netdisk の使用方法 Baidu Netdisk の使用方法 - Baidu Netdisk の使用方法 Mar 04, 2024 pm 09:28 PM

Baidu Netdisk の使い方をまだ知らない友人も多いので、以下では編集者が Baidu Netdisk の使い方を説明しますので、必要な場合は急いでご覧ください。ステップ 1: Baidu Netdisk をインストールした後、直接ログインします (図を参照); ステップ 2: 次に、ページのプロンプトに従って [マイ共有] と [転送リスト] を選択します (図を参照); ステップ 3: 「 「友達共有」では、写真やファイルを友達と直接共有できます (図を参照); ステップ 4: 次に、「共有」を選択し、コンピューター ファイルまたはネットワーク ディスク ファイルを選択します (図を参照); 5 番目のステップ 1:次に、友達を見つけることができます (写真に示すように); ステップ 6: 「機能宝箱」で必要な機能を見つけることもできます (写真に示すように)。以上、編集者の意見です

素早くコピー&ペーストする方法を学ぶ 素早くコピー&ペーストする方法を学ぶ Feb 18, 2024 pm 03:25 PM

コピー&ペーストのショートカットキーの使い方 コピー&ペーストは、毎日パソコンを使っていると頻繁に遭遇する操作です。作業効率を向上させるためには、コピー&ペーストのショートカットキーを使いこなすことが非常に重要です。この記事では、読者がコピー アンド ペースト操作をより便利に実行できるように、一般的に使用されるコピー アンド ペーストのショートカット キーをいくつか紹介します。コピーのショートカット キー: Ctrl+CCtrl+C はコピーのショートカット キーで、Ctrl キーを押しながら C キーを押すと、選択したテキスト、ファイル、画像などをクリップボードにコピーできます。このショートカットキーを使用するには、

Go 言語開発ツールの紹介: 必須ツールのリスト Go 言語開発ツールの紹介: 必須ツールのリスト Mar 29, 2024 pm 01:06 PM

タイトル: Go 言語開発ツール入門: 必須ツール一覧 Go 言語の開発プロセスでは、適切な開発ツールを使用することで開発効率とコード品質を向上させることができます。この記事では、Go 言語開発で一般的に使用されるいくつかの重要なツールを紹介し、読者がその使用方法と機能をより直感的に理解できるように、具体的なコード例を添付します。 1.VisualStudioCodeVisualStudioCode は、豊富なプラグインと機能を備えた軽量で強力なクロスプラットフォーム開発ツールです。

KMS アクティベーション ツールとは何ですか? KMS アクティベーション ツールの使用方法は? KMS アクティベーション ツールの使用方法は? KMS アクティベーション ツールとは何ですか? KMS アクティベーション ツールの使用方法は? KMS アクティベーション ツールの使用方法は? Mar 18, 2024 am 11:07 AM

KMS ライセンス認証ツールは、Microsoft Windows および Office 製品のライセンス認証に使用されるソフトウェア ツールです。 KMS は KeyManagementService の略で、鍵管理サービスです。 KMS ライセンス認証ツールは、KMS サーバーの機能をシミュレートして、コンピューターが仮想 KMS サーバーに接続して Windows および Office 製品をライセンス認証できるようにします。 KMS ライセンス認証ツールは、サイズが小さく、機能が強力です。ワンクリックで永続的にライセンス認証できます。インターネットに接続せずに、あらゆるバージョンのウィンドウ システムとあらゆるバージョンの Office ソフトウェアをライセンス認証できます。現在、最も成功しているツールです。頻繁に更新される Windows ライセンス認証ツール 今日はそれを紹介します kms ライセンス認証作業を紹介します

ショートカットキーを使ってセルを結合する方法 ショートカットキーを使ってセルを結合する方法 Feb 26, 2024 am 10:27 AM

セルを結合するためのショートカット キーの使用方法 日常業務では、表の編集や書式設定が必要になることがよくあります。セルの結合は、表の美しさと情報の表示効果を向上させるために、隣接する複数のセルを 1 つのセルに結合する一般的な操作です。 Microsoft ExcelやGoogle Sheetsなどの主流の表計算ソフトでは、セルの結合操作は非常に簡単でショートカットキーで実現できます。この2つのソフトでセルを結合するショートカットキーの使い方を紹介します。存在する

See all articles