javascript - NicEditor 字体大小从标签到

Question

嗨，我正在使用 NicEditor，我希望字体大小以不同的方式工作。现在编辑器使用：

<font size='1...7'>the selected text here</font>

我不希望它成为一个跨度标签，即

<span style='font-size:30px'>the selected text here</span>

这是下拉菜单的代码：

var nicEditorFontSizeSelect = nicEditorSelect.extend({
    sel : {1 : '1 (8pt)', 2 : '2 (10pt)', 3 : '3 (12pt)', 4 : '4 (14pt)', 5 : '5 (18pt)', 6 : '6 (24pt)', 7 : '7 (36pt)', 8 : '8 (48pt)', 9 : '9 (72pt)', 10 : '10 90pt)', 11 : '11 (100pt)'},
    init : function() {
        this.setDisplay('Font Size...');
        for(itm in this.sel) {
            this.add(itm,'<font size="'+itm+'">'+this.sel[itm]+'</font>');
        }       
    }
});

但我找不到要修改的代码，以便它将替换成文本区域内font的标签。span

任何建议都非常受欢迎。

谢谢

Answer 1

Know this is an old question but should anyone else need the answer here it is.

Note this is very basic and could do with improving, for example it'll create nested 's.

Anyway, add this JS code before you initialise your nicEditor, create a custom plugin:

var nicSelectOptionsCustomFormat = {
    buttons : {
        'fontCustomSize' : {name : __('Font size'), type : 'nicEditorCustomFormatSelect'}
    }
};
var nicEditorCustomFormatSelect = nicEditorSelect.extend({
    sel : {'11px' : '11px', '13px' : '13px', '15px' : '15px', '19px' : '19px', '22px' : '22px'},

    init : function() {
        this.setDisplay('Font size');
        for(itm in this.sel) {
            this.add(itm,'<span style="size:'+itm+'">'+this.sel[itm]+'</span>');
        }
    }

    ,update : function(elm) {
        var newNode = document.createElement('span');
        newNode.style.fontSize = elm;
        var rng = this.ne.selectedInstance.getRng().surroundContents(newNode);
        this.close();
    }
});
nicEditors.registerPlugin(nicPlugin,nicSelectOptionsCustomFormat);

Then use fontCustomSize when you create your editor, eg:

var config = {
    buttonList: ["bold", "italic", "underline","fontCustomSize"]
};
var e = new nicEditor(config);
e.panelInstance("page-description");