因為編者我還是一個初學入門者,無論是JS還是PHP,都是懂了點皮毛。今天在研究ckeditor編輯器的時候遇到了一些問題,雖然這只是我的個人問題,但覺得可以分享給其他人,或許也有像我這樣的初學者也會遇到這問題。
好了,現在談一下這問題。
在接觸ckeditor編輯器之前,編者製作的表單都是用的<textarea>標籤,比如製作的留言本、新聞釋出器等,但由於<textarea>的輸入框輸入的內容格式單一,基本沒什麼擴充套件功能,所以使用了ckeditor編輯器。在這裡先宣告,編者使用的是ckeditor3.6版本的。
在<textarea>的時候,我們用js判斷輸入框內容是否為空一般都是這麼寫的:
<script> function check_form(){ if(myform.content.value==""){ alert("請輸入內容!"); return false; } } </script>
下面是表單程式碼:
<form action="" name="myform" method="post"> <textarea name="content" rows=10 cols=40>預設內容</textarea> <input type="submit" name="sub" check_form()"> </form>
上面的兩端程式碼組合是可以進行輸入框內容驗證的。
那麼在使用了ckeditor3.6之後,如果js裡繼續使用myform.content.value獲取輸入框裡的內容的話是沒有效果的了。後來網上了解到,在ckeditor3.6版本里,要獲取到編輯器裡的內容,需要使用CKEDITOR.instances.content_name.getData(),其中content_name換成你自己的name屬性值,在3.0及之前版本使用CKEDITOR.instancesgetData()。而且獲取到的編輯器裡的內容是帶有html標籤的,這要注意了。
譬如編者最後改版的js程式碼如下:
<script> function check_form(){ var content= CKEDITOR.instances.content.getData(); if(content==""||content.match("請在這裡輸入新聞內容!")){ xw.content.focus(); alert("請填寫新聞內容!"); return false; } } </script>
JS程式碼可見,用CKEDITOR.instances.content_name.getData()獲取到編輯器裡的內容到變數content裡,再在if條件裡判斷content內容是否為空,也判斷是否包含下面我設定的預設值“請在這裡輸入新聞內容!”,一旦判斷有其中之一就認為沒有使用者填寫新聞內容。這裡之所以用content.match()方法判斷而不用content==”請在這裡輸入新聞內容!”是因為獲取到的編輯器裡的內容帶有html標籤,所以嘛,就不解釋了。
再看錶單程式碼如下(結合PHP):
<form name="myform" action="" method="post"> //顯示編輯器(之前要建立CKEditor物件,這裡就不寫了) <?php $ed->editor("content","請在這裡輸入新聞內容!"); ?> <input type="submit" name="sub" check_form()"> </form>
表單程式碼中可見,顯示的編輯器的name屬性值是content,預設顯示的文字是“請在這裡輸入新聞內容!”
這樣就完成了對ckeditor編輯器內容是否為空的檢測了。
當然可能這篇博文還有很多不完善的地方,希望各位高手們指出,以便日後完善一下。