快捷導(dǎo)航

Javascript獲取與設(shè)置ckeditor數(shù)據(jù)的實(shí)現(xiàn)方法

更新時(shí)間：2023年08月06日 11:56:01 作者：mdxy

最近編輯器后臺(tái)升級成了ckeditor,但原來后臺(tái)有很多對應(yīng)編輯器內(nèi)容的替換功能,那么就需要用js獲取ckeditor編輯器里面的內(nèi)容,這里就為大家介紹一下具體的實(shí)現(xiàn)方法

CKeditor編輯器是FCKeditor的升級版本，相對于FCK來說，確實(shí)比較好用，加載速度也比較快

例如在頁面中載入了ckEditor作為程序內(nèi)容的輸入

頁面加載編輯器大約配置如下

js配置代碼

<script type="text/javascript">
??? CKEDITOR.replace('content',{
??????? filebrowserBrowseUrl: '/ckfinder/ckfinder.html?Type=Files',
??????? filebrowserImageBrowseUrl: '/ckfinder/ckfinder.html?Type=Images',
??????? filebrowserFlashBrowseUrl: '/ckfinder/ckfinder.html?Type=Flash'
??? });
</script>

頁面中是使用Jquery進(jìn)行頁面提交的，但是直接用$("#content").val()或$("textarea").eq(0).val()是無法拿到content內(nèi)容的。這里我們需要使用ckEditor內(nèi)置的函數(shù)來拿到這個(gè)內(nèi)容。

從CKEditor取數(shù)據(jù)

var content=CKEDITOR.instances['content'].getData();
//或
var content=CKEDITOR.instances.content.getData();

向CKEditor設(shè)置數(shù)據(jù)時(shí)

CKEDITOR.instances['content'].setData('test');
或
CKEDITOR.instances.content.setData('test');

以下是如果通過JS獲取CKeditor編輯器的值，用于表單驗(yàn)證

if(CKEDITOR.instances.content.getData()==""){
alert("內(nèi)容不能為空！");
return false;
}

content是textarea的name

下次發(fā)下CKeditor的配置還有上傳配置，我只弄了PHP的上傳

剛有個(gè)朋友反應(yīng)說FIREFOX下不能判斷為空，我稍微修改了下

我的在FF下測試通過了，以下是JS代碼

function trim(str){
??? return str.replace(/(^/s*)|(/s*$)/g,"");
? }//去掉空格
? var str=CKEDITOR.instances.content.getData();
?? str=str.replace("<br />","");
?? str=str.replace("<br>","");
?? str=trim(str);
??? if(str==""){
??????? alert("內(nèi)容不能為空！");
??????? return false;
??? }

具體在使用中去組合，多謝這位朋友的提出

eval() 函數(shù)可計(jì)算某個(gè)字符串，并執(zhí)行其中的的 JavaScript 代碼。 (很重要的一個(gè)函數(shù))

var cke_arr = CKEDITOR.instances;
eval("var cke_content = CKEDITOR.instances."+ta_id+".getData();");

到此這篇關(guān)于Javascript獲取與設(shè)置ckeditor數(shù)據(jù)的實(shí)現(xiàn)方法的文章就介紹到這了,更多相關(guān)js設(shè)置ckeditor數(shù)據(jù)內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！