KindEditor用法介紹

2022-08-29 23:27:21 字數 4518 閱讀 5209

kindeditor是一套很方便的html編譯器外掛程式。在這裡做乙個簡單的使用介紹。

把整個資料夾放到你的web伺服器裡(放哪都行,但放的位置需要有訪問許可權,最好建立乙個許可權為777的public資料夾,把kindeditor資料夾放進去)。

之後在需要用到kindeditor的頁面引入以下兩個js檔案(具體js目錄根據你的kindeditor資料夾位置而定)12

<scriptcharset="utf-8" src="kindeditor資料夾所在目錄/kindeditor資料夾名/kindeditor.js">

<scriptcharset="utf-8" src="kindeditor資料夾所在目錄/kindeditor資料夾名/lang/zh-cn.js">

這個指令碼裡的 editor = k.create('#你的textarea的id名', {}); 這個,對應的就是乙個kindeditor編輯器。

例子:假設我們現在有乙個textarea標籤,id設為"kindeditor_demo"

1<textareaid="kindeditor_demo">

我們再引入剛剛提到的兩個js檔案後,再寫如下js**到該頁面,12

3456

78

那麼這個textarea標籤就會變成kindeditor編譯器

用法一,自己選擇需要的功能:

按照上面的部署方式,最終呈現的是乙個完整版kindeditor編譯器,可其中很多功能不一定需要,那麼可以在剛剛提到的js指令碼中對kindeditor編譯器進行控制。

假設我們只需要:插入表情和文字顏色的功能。則可以在js指令碼中設定「items 」選項。如:12

345kindeditor.ready(function(k) );

});

(同理,對於該編譯器的很多設定都是通過這種方式來完成的)

用法二,kindeditor的乙個奇怪特性:

在頁面第一次載入時,不能隱藏kindeditor所在的標籤,否則即使後面利用js將css的display設定為block,kindeditor也不會顯示。

解決的辦法是先讓網頁將所有的kindeditor編輯器載入完後,再用下面這種方法將需要隱藏的部分隱藏12

345window.onload = hidden_box;

functionhidden_box()

這段js指令碼是等頁面載入完後才會執行,所以此時kindeditor已經載入完了,可以被隱藏了

用法三,獲取kindeditor編譯器的內容。

我們看到的kindeditor編譯器實際上不是我們之前自己寫在頁面中的textarea標籤,當我們在kindeditor編譯器裡輸入完內容並提交表單後,kindeditor會自動將我們輸入的內容「同步」到之前我們自己建的textarea標籤中,之後再傳送表單。

所以我們直接獲取textarea標籤的內容實際是沒用的,正確的做法是讓kindeditor將資料「同步」到textarea標籤中後,再獲取textarea標籤中的內容。

我們可以利用我們之前建的kindeditor物件對kindeditor編譯器進行操作,令其進行同步資料。12

345kindeditor.ready(function(k) );

});

上述**之前提到過,其中的editor就是「id為text_new_continue的textarea標籤」所對應的kindeditor物件。

當我們想令kindeditor編譯器將資料同步到「id為text_new_continue的textarea標籤」時,就可以操作editor物件。如:1

2editor.sync();//將kindeditor的資料同步到textarea標籤。

varvalue_content = $("#text_new_continue").val();

其中value_content就是kindeditor編譯器裡的內容

把整個資料夾放到你的web伺服器裡(放哪都行,但放的位置需要有訪問許可權,最好建立乙個許可權為777的public資料夾,把kindeditor資料夾放進去)。

之後在需要用到kindeditor的頁面引入以下兩個js檔案(具體js目錄根據你的kindeditor資料夾位置而定)12

<scriptcharset="utf-8" src="kindeditor資料夾所在目錄/kindeditor資料夾名/kindeditor.js">

<scriptcharset="utf-8" src="kindeditor資料夾所在目錄/kindeditor資料夾名/lang/zh-cn.js">

這個指令碼裡的 editor = k.create('#你的textarea的id名', {}); 這個,對應的就是乙個kindeditor編輯器。

例子:假設我們現在有乙個textarea標籤,id設為"kindeditor_demo"

1<textareaid="kindeditor_demo">

我們再引入剛剛提到的兩個js檔案後,再寫如下js**到該頁面,12

3456

78

那麼這個textarea標籤就會變成kindeditor編譯器

用法一,自己選擇需要的功能:

按照上面的部署方式,最終呈現的是乙個完整版kindeditor編譯器,可其中很多功能不一定需要,那麼可以在剛剛提到的js指令碼中對kindeditor編譯器進行控制。

假設我們只需要:插入表情和文字顏色的功能。則可以在js指令碼中設定「items 」選項。如:12

345kindeditor.ready(function(k) );

});

(同理,對於該編譯器的很多設定都是通過這種方式來完成的)

用法二,kindeditor的乙個奇怪特性:

在頁面第一次載入時,不能隱藏kindeditor所在的標籤,否則即使後面利用js將css的display設定為block,kindeditor也不會顯示。

解決的辦法是先讓網頁將所有的kindeditor編輯器載入完後,再用下面這種方法將需要隱藏的部分隱藏12

345window.onload = hidden_box;

functionhidden_box()

這段js指令碼是等頁面載入完後才會執行,所以此時kindeditor已經載入完了,可以被隱藏了

用法三,獲取kindeditor編譯器的內容。

我們看到的kindeditor編譯器實際上不是我們之前自己寫在頁面中的textarea標籤,當我們在kindeditor編譯器裡輸入完內容並提交表單後,kindeditor會自動將我們輸入的內容「同步」到之前我們自己建的textarea標籤中,之後再傳送表單。

所以我們直接獲取textarea標籤的內容實際是沒用的,正確的做法是讓kindeditor將資料「同步」到textarea標籤中後,再獲取textarea標籤中的內容。

我們可以利用我們之前建的kindeditor物件對kindeditor編譯器進行操作,令其進行同步資料。12

345kindeditor.ready(function(k) );

});

上述**之前提到過,其中的editor就是「id為text_new_continue的textarea標籤」所對應的kindeditor物件。

當我們想令kindeditor編譯器將資料同步到「id為text_new_continue的textarea標籤」時,就可以操作editor物件。如:1

2editor.sync();//將kindeditor的資料同步到textarea標籤。

varvalue_content = $("#text_new_continue").val();

其中value_content就是kindeditor編譯器裡的內容

KindEditor用法介紹

kindeditor是一套很方便的html編譯器外掛程式。在這裡做乙個簡單的使用介紹。把整個資料夾放到你的web伺服器裡 放哪都行,但放的位置需要有訪問許可權,最好建立乙個許可權為777的public資料夾,把kindeditor資料夾放進去 之後在需要用到kindeditor的頁面引入以下兩個js...

kindEditor簡單用法

最近學習了一下kindeditor,做一些簡單的東西,此例子用的是kindeditor自帶的批量和單上傳的方法 富文字編輯器 kindeditor.ready function k else 5 word surplus html pattern 輸入顯示 對於kindeditor獲取不到texta...

sicily string用法介紹

最近老是要用到字串的函式,有些函式自己早就忘光了,先總結下string用法,免得以後又不記得。用法例子分析 1 substr 這個辦法獲取乙個字串中子字串。例如 str absndfg 想獲取s sndf string s str.substr 2,4 獲取從2開始長度為4的子字串,如果長度不滿足4...