張睿++文福安

摘要：自e-learning出現(xiàn)以來，人們對于題庫系統(tǒng)的建設(shè)進(jìn)行了大量研究。然而圍繞題庫建設(shè)的研究主要集中在數(shù)據(jù)庫設(shè)計以及自動組卷技術(shù)，對于試題編輯方法的討論沒有得到重視。針對這種情況，本文在詳細(xì)討論各種試題編輯技術(shù)的基礎(chǔ)上，結(jié)合網(wǎng)絡(luò)環(huán)境中廣泛使用的CKeditor編輯器，在其強大的插件擴展支持下實現(xiàn)試題的可視化編輯，解決了傳統(tǒng)題庫系統(tǒng)中編輯試題操作步驟冗余、操作結(jié)果不直觀的問題。使出題人實現(xiàn)試題編輯的真正所見即所得，極大的改善了系統(tǒng)使用過程中的用戶體驗并提高了出題人的效率。

關(guān)鍵詞：試題編輯；CKeditor；插件開發(fā)；web

中圖分類號：TP39

文獻(xiàn)標(biāo)識碼：A

DOI：10.3969/j.issn.1003-6970.2015.09.005

0 引言

近年來，各級考試部門負(fù)責(zé)的考試類型、服務(wù)對象、考試模式日益復(fù)雜，同時越來越多的考試機構(gòu)開始使用計算機化考試取代傳統(tǒng)的紙筆考試。既然是計算機化的考試，那么實現(xiàn)試題的計算機化編輯則成為考試環(huán)節(jié)中必不可少的一部分。傳統(tǒng)的題庫系統(tǒng)基于C/S架構(gòu)，這就導(dǎo)致了制題在空間上的局限型以及題庫系統(tǒng)的封閉性。高校教育資源共享的開放式教學(xué)模式強調(diào)充分利用互聯(lián)網(wǎng)和移動網(wǎng)絡(luò)進(jìn)行訪問，然而在開發(fā)教學(xué)教育資源方面，高校各自為政，無統(tǒng)一規(guī)劃下的資源建設(shè)出現(xiàn)了許多矛盾問題，資源缺乏共享，教學(xué)資源內(nèi)容單一?；趙eb的題庫系統(tǒng)只需要在安裝有瀏覽器的計算機上即可使用，并且借助網(wǎng)絡(luò)的跨空間性，使制題人員不受試題錄制地點的限制。同時現(xiàn)有的題庫系統(tǒng)在編輯試題上存在操作步驟冗余、操作結(jié)果不直觀的問題。比如對于填空題這種基本的試題類型而言，傳統(tǒng)的題庫系統(tǒng)在編輯題目時是通過占位符來標(biāo)識一個“空”，這種錄入方式即繁瑣又不能滿足所見即所得的要求，給制題人員帶來很大的不便。本文通過借助CKeditor編輯器強大的插件擴展機制并結(jié)合相應(yīng)題目類型的需求，編寫出適用于編輯不同題目類型的小工具并整合進(jìn)系統(tǒng)中，實現(xiàn)簡單的試題編輯過程以及所見即所得的編輯結(jié)果。

1 web端試題編輯技術(shù)

筆者通過檢索國內(nèi)外相關(guān)領(lǐng)域的論文，發(fā)現(xiàn)基于web端的試題編輯技術(shù)主要存在兩種思路：在IE瀏覽器中借助ActiveX技術(shù)調(diào)用word編輯器實現(xiàn)試題編輯和借助web上流行的富文本編輯器編輯試題。

ActiveX是微軟對于一系列策略性面向?qū)ο蟪绦蚣夹g(shù)和工具的稱呼，主要的技術(shù)就是組件對象模型（Component Object Model，COM組件）。IE瀏覽器通過這種技術(shù)可以打開服務(wù)器上的遠(yuǎn)程Office文件，包括Word文件、Excel文件等，并且還能在線編輯、調(diào)用Word文件、Excel文件等。這種web端編輯技術(shù)優(yōu)點是借助word本身強大的字處理功能，可以實現(xiàn)復(fù)雜的編輯以及排版。然而其存在以下缺點：

（l）題庫系統(tǒng)無法實現(xiàn)跨瀏覽器。因為ActiveX是微軟提供的技術(shù)并且只能在IE瀏覽器下使用，這樣就造成了題庫系統(tǒng)只能通過IE瀏覽器訪問，失去了web原本跨平臺的優(yōu)勢。

（2）瀏覽器中使用word編輯試題過于龐大。word這種字處理軟件適合的是復(fù)雜辦公場景，毋庸置疑其本身具有強大的功能。但是制題系統(tǒng)有其應(yīng)用的特殊性，word中絕大部分功能是用不到的。制題系統(tǒng)中最常用的有以下功能：對文字進(jìn)行格式化處理，例如加粗、改變字號等；實現(xiàn)文字與圖片的混排；插入表格、公式。隨著web技術(shù)的不斷發(fā)展，現(xiàn)如今這些功能完全可以由web端的富文本編輯器來實現(xiàn)，因此基于web的制題系統(tǒng)完全沒有必要為了實現(xiàn)這些簡單功能而引入龐大的word。

（3）自定義開發(fā)ActiveX比較困難。錄制試題有其操作上的一般性，但檢驗一個題庫系統(tǒng)是否滿足用戶需求應(yīng)當(dāng)從其對特殊操作的支持程度上來體現(xiàn)?；贑Keditor的web端題庫系統(tǒng)可以通過其提供的插件擴展機制方便的開發(fā)符合自己需求的插件從而支持相應(yīng)的特殊操作。

鑒于基于ActiveX技術(shù)進(jìn)行編輯試題存在以上問題，本文中采取的是后一種編輯方式：借助web上流行的CKeditor編輯器實現(xiàn)試題編輯。由于CKeditor底層做了很好的瀏覽器兼容，這樣就使得題庫系統(tǒng)具有跨瀏覽器的特性。同時Ckeditor提供了許多插件供開發(fā)者使用，當(dāng)然最方便的還是它提供了簡單的白定義插件編寫技術(shù)。因為CKeditor編輯器本身就是web端的應(yīng)用，因此在其中呈現(xiàn)諸如圖片、音頻、視頻等多媒體元素時具有先天的優(yōu)勢。同時，由于該題庫系統(tǒng)是基于web的，使用CKeditor編輯器可以使開發(fā)者專注于前端技術(shù)即可，不用像利用ActiveX技術(shù)那樣需要額外學(xué)習(xí)微軟的開發(fā)技術(shù)，節(jié)約開發(fā)成本的同時使得系統(tǒng)可維護性增強。

2 CKeditor編輯器的優(yōu)點

CKeditor是目前最優(yōu)秀的所見即所得網(wǎng)頁編輯器之一，其具體突出特點如下：

1、極強的靈活性，CKeditor是高度白定義的web編輯器。其白定義主要體現(xiàn)在以下兩個方面：

（l）外觀自定義（UI自定義），外觀白定義包括編輯器丁具欄的數(shù)量以及工具欄圖標(biāo)、編輯器的皮膚等的自定義。

（2）插件白定義（功能白定義），盡管CKeditor編輯器擁有數(shù)以百計的插件可供開發(fā)者使用，但是編輯試題又有其操作上的特殊性。傳統(tǒng)的CKeditor編輯器插件并不能滿足制題人員對于編輯試題過程直觀、簡單的要求。因此我們需要借助其提供的插件擴展機制針對不同的題型開發(fā)出小工具，并整合進(jìn)CKeditor編輯器的工具欄進(jìn)行使用。

2、功能強大，CKEditor除能夠完成編輯器所需的一般功能外，其強大的內(nèi)容過濾功能可以保證出題人員粘貼內(nèi)容格式的完整性。

3 所見即所得試題編輯技術(shù)的實現(xiàn)

題庫系統(tǒng)的主要用戶是教師，而教師對于一些試題的答題操作已經(jīng)形成習(xí)慣，例如填空題就應(yīng)該用一個具有一定長度的空著的下劃線代表一個“空”。然而在傳統(tǒng)的制題系統(tǒng)中卻很難在題目中直觀的錄入一個“空”。一般的解決方法無非是用一對括號或者其它占位符將應(yīng)該出現(xiàn)“空”的位置標(biāo)記下來，然后試題呈現(xiàn)引擎讀到到該占位符就將其解析為一個“空”并呈現(xiàn)出來。這種錄入方式的缺點非常明顯：制題人需要操作的步驟繁瑣且不直觀。然而借助CKeditor的插件擴展機制，我們完全可以開發(fā)出針對填空題錄入“空”的工具并整合進(jìn)CKeditor的工具欄，使制題人通過點擊按鈕即可在光標(biāo)位置插入一個與紙筆考試完全一樣的“空”，并且在彈出的對話框中錄入該“空”對應(yīng)的答案?！翱铡钡妮斎肓鞒倘缦聢Dl所示。

根據(jù)圖1的操作流程，將整個錄入“空”的功能抽象成一個CKeditor的插件，該插件的名字命名為textEntry，其可以注冊到CKeditor維護的全局插件集合中。然后在該插件上定義對話框以及對話框中存在的元素，例如錄入“空”的輸入框。最后定義對話框關(guān)閉后的動作：即將“空”插入到試題中。

由以上的分析得出該插件的整體結(jié)構(gòu)如圖2所不：

對于如何開發(fā)CKeditor的插件請參看http：//docs.ckeditor.com/#！/guide/plugin sdk intro.，在此不詳細(xì)討論。根據(jù)以上分析以及最終的編碼實現(xiàn)圖3的最終效果。

由于該“空”實際上是由一個標(biāo)準(zhǔn)的html元素input實現(xiàn)的，只不過通過CSS將該input設(shè)置成“空”的樣子。從這個角度出發(fā)，我們可以很方便通過CSS修改空的樣式，包括其長度、邊框粗細(xì)等，進(jìn)一步體現(xiàn)了基于web端的編輯器開發(fā)試題編輯工具的靈活性。如上圖3所示，借助該工具，制題人員只需簡單的選中要錄入“空”的區(qū)域點擊編輯器上的按鈕即可方便的插入一個“空”，實現(xiàn)了簡單的操作步驟，直觀的操作的結(jié)果。

在通用的題庫系統(tǒng)中，是否能支持各種課程各種類型的題目是評價題庫系統(tǒng)質(zhì)量的一個很重要的指標(biāo)。由于很多題目需要同時顯示文字和圖片，有些題目甚至要求可以播放聲音、視頻、fash動畫等，如英語的聽力試題。如何方便的將這些多媒體素材編輯進(jìn)試題并在編輯完成后立即看到或聽到最終效果，這對一個編輯試題工具易用性起到至關(guān)重要的作用。由于我們所開發(fā)的題庫系統(tǒng)是基于web的，目前可以支持絕大多數(shù)的多媒體文件，如圖片、聲音、視頻等。在這里，我們以向試題中插入音頻為例介紹實現(xiàn)該功能的思路。

利用CKeditor自身的上傳文件的功能將該本地音頻文件上傳至服務(wù)器做持久化保存。緊接著返回該音頻在服務(wù)武器上的地址。最后，根據(jù)返回的地址，我們將支持音頻文件的audio標(biāo)簽插入到編輯器中，并將其src設(shè)置為服務(wù)器返回的地址。有一點需要注意的是CKeditor本身默認(rèn)是不支持音頻播放的，即返回的音頻是以一個占位圖片的形式插入到題目中。為了解決這個問題，我們同樣為此功能編寫專門的插件。該插件最終實現(xiàn)的效果如圖4所示。

制題人員通過點擊音頻播放器即可試聽播放的音頻，解決了以往上傳音頻文件后無法試聽的問題。插入圖片、視頻的處理方式也是如此。

4 總結(jié)與展望

基于CKeditor編輯器進(jìn)行題庫系統(tǒng)中試題編輯工具的開發(fā)，一方面可以借助編輯提供的基本功能，比如對文字樣式的處理等，減少開發(fā)成本；另一方面通過其提供的強大插件擴展機制，我們可以輕松的編寫符合特定題型錄制的插件并將其整合進(jìn)CKeditor編輯器，從而方便出題人員對于相關(guān)題目的錄制。同時隨著htm15技術(shù)的發(fā)展與完善，基于web的應(yīng)用功能越來越強大，雖然文章中實現(xiàn)的功能相對簡單，但是開發(fā)人員可以就實際需要進(jìn)行復(fù)雜功能插件的開發(fā)，這也正體現(xiàn)了CKeditor的可擴展性。