2012-09-12 47 views
0

我試圖在HtmlEditor的ToolBar中插入一個按鈕。按鈕應該通過鼠標或鍵盤獲取選定的文本,並在所選文本的開始處添加「#」字符以將其定位爲URL。Ext-JS Html編輯器獲取選定文本

據我所知,最好的解決方案是創建一個插件添加按鈕到HTML編輯器工具欄。我發現了創造代碼,但問題在於; 我如何獲得選定的文本? EXT-js版2.2

而且有提供創建HTML編輯器工具欄按鈕插件代碼:

Ext.ns('Ext.ux.form.HtmlEditor'); 

    Ext.ux.form.HtmlEditor.NewLine = Ext.extend(Ext.util.Observable, { 
     init:function (cmp) { 
      this.cmp = cmp; 
      this.cmp.on('render', this.onRender, this); 
     }, 
     onRender:function() { 
      this.cmp.getToolbar().addButton([ 
       { 
        iconCls:'newline', //your iconCls here 
        handler:function() { 
         this.cmp.insertAtCursor('<br>&nbsp;'); 

        }, 
        scope:this 
       } 
      ]); 
     } 
    }); 
+0

也許[此](http://www.sencha.com/forum/showthread.php?83407-TextField-Manipulating-the-selection-and-getting-the-selected-text-in -ExtJS-2)可以幫助...你可以添加extjs版本的問題? – VDP

+0

不幸的是沒有工作.. –

回答

0

你可以將選定的文本是這樣的:window.getSelection()

這使你是一個Selection對象。如果你只想得到文字:window.getSelection().toString()

但是如果你想使東西粗體或什麼的,你需要檢查選擇是否在編輯器內。您需要的一切都在選擇對象內。

=>校正:htmlEditor使用iframe,您可以通過getWin函數獲得iframe窗口。

請注意,這隻適用於現代瀏覽器(而不是< IE9),從您使用的舊版Ext版本來看,這可能對您而言是個問題......但IE的解決方法。

more info

+0

window.getSelection()。toString()在那裏工作!非常感謝!我的例子的確切線:var text = this.cmp.getWin()。getSelection()。toString(); –

+0

只是[找到它](http://docs.sencha.com/ext-js/2-3/source/HtmlEditor.html#Ext-form-HtmlEditor-method-getEditorBody):) getWin將工作。不知道getEditorBody是否使用getSelection方法返回對象。 getDoc可能也會起作用。 – VDP

+0

getEditor正文返回對象,getDoc也正常工作。哇,我很感謝你的偉大答案!在這裏很棒!它可能會更好,如果我投票給你,但不幸的是我沒有聲譽:D –