編寫HtmlArea控制項的外掛程式 經典教程

2021-08-29 03:22:30 字數 1945 閱讀 5509

htmlarea是乙個強大的wysiwyg的html編輯器。它的強大不僅體現在它的功能的完善和成熟上,還體現在它為開發者提供了乙個靈活的架構來編寫你自己需要的外掛程式!下面本文通過乙個實際的例子來講解外掛程式的開發過程。

1首先在其plugin目錄下為你的外掛程式建立乙個目錄,例如formcontrol,這個外掛程式的作用是在頁面中插入html表單元素,本例中我們只實現最簡單的文字輸入框的插入。

2 接下來,建立form-control.js檔案。

// object that will insert form control into htmlarea-3.0

function formcontrol(editor) else );

*******.push(id);}}

// add a new line in the *******

cfg.*******.push(*******);

};formcontrol._plugininfo = ;

formcontrol.prototype.buttonpress = function(editor, button_id)

}// this function requires the file popupdiv/popupwin to be loaded from browser

// called when the user clicks the insert input button

formcontrol.prototype._insertinput = function(editor)

var doc = editor._doc;

// create the table element

var input = doc.createelement("input");

// assign the given arguments

for (var field in param)

switch (field)

}if (htmlarea.is_ie) else

return true;

}, null);

};formcontrol.btnlist = [

// basic controls

["insert-input"],

null,   // separator

// macro controls

["insert-date"]

3 接下來在lang目錄下建立乙個en.js的資源檔案

"to-insert-input"                                            : "insert input",

"to-insert-date"                                        : "insert date macro",

dialogs:

};4 建立兩張,放在img目錄下insert-date.gif insert-input.gif

5 在popups目錄下,建立insert_input.html

insert input

name:

okcancel

6 在example目錄下,建立乙個測試檔案

在相應位置加入以下**

htmlarea.loadplugin("formcontrol");

var editor = null;

function initeditor() {

editor = new htmlarea("ta");

// register the formcontrol plugin with our editor

editor.registerplugin("formcontrol");

到此為止,整個外掛程式就可以正常工作了。這只是開發外掛程式的一種形式,另外你還可以覆蓋原有的按鈕的功能。或者參考它自帶的外掛程式來了解更複雜的外掛程式編寫方法。

編寫HtmlArea控制項的外掛程式 經典教程

htmlarea是乙個強大的wysiwyg的html編輯器。它的強大不僅體現在它的功能的完善和成熟上,還體現在它為開發者提供了乙個靈活的架構來編寫你自己需要的外掛程式!下面本文通過乙個實際的例子來講解外掛程式的開發過程。1首先在其plugin目錄下為你的外掛程式建立乙個目錄,例如formcontro...

jquery外掛程式的編寫

一 區別兩種普通的寫法 jquery function 全寫為jquery document ready function function jquery 其實際上是執行 para 匿名方法,只不過是傳遞了jquery物件。jquery function 用於存放操作dom物件的 執行其中 時dom...

7 2 編寫外掛程式 模型外掛程式

概述 helloworld外掛程式教程 外掛程式允許完全訪問模型及其基本元素 鏈結 節點 碰撞物件 的物理屬性。下面的外掛程式將對其父模型應用乙個線性速度。cd gazebo plugin tutorial geditmodel push.cc 外掛程式 include include includ...