如何在Tinymce WYSIWYG Editor中设置笔颜色

时间:2014-02-14 19:06:59

标签: knockout.js tinymce editor

我正在使用tinymce编辑器插件。我在viewModel:

中将我的文本作为淘汰函数介绍
self.myText = ko.observable("bla bla bla bla bla");

我的HTML是:

<textarea id="Textarea1"  data-bind="tinymce: myText, tinymceOptions: { 
     plugins : 'wordcount,noneditable'
     ,theme_advanced_buttons2 : ''
     ,theme_advanced_buttons1 : ''
     ,resize: 'both'
     }" style="width:100%; height: 700px">
</textarea>    

这很好用。 但是,我希望用户能够编辑文本,以便我可以以简单的方式跟踪更改。这里有几个问题。但首先我希望有一种方法可以在打开编辑器时设置“笔”颜色,以便现有文本保持原样(黑色),但新文本显示为蓝色。

如果删除文字会引入红色删除而不是实际,那也会很好 删除。

我无法在文档中找到这些选项,但也许可以在更新部分自定义绑定中完成?

ko.bindingHandlers.tinymce = {
    init: function (element, valueAccessor, allBindingsAccessor, context) {
        var options = allBindingsAccessor().tinymceOptions || {};

        function writeModelValue(ed) {
            var modelValue = valueAccessor();
            if (ko.isWriteableObservable(modelValue)) {
                modelValue(ed.getContent());
            }
        }

        //handle edits made in the editor
        options.setup = function (ed) {
            ed.onChange.add(writeModelValue); //on add undo point
            ed.onKeyUp.add(writeModelValue); //on add undo point
            ed.onUndo.add(writeModelValue); //on undo
            ed.onRedo.add(writeModelValue); //on redo
        };


        $(element).tinymce(options);

        //handle destroying an editor 
        ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
            $(element).tinymce().remove();
        });
    },
    update: function (element, valueAccessor, allBindingsAccessor, context) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        if (value !== $(element).html()) {
            $(element).html(value);
        }

        // Do something smart here…?


    }
};

0 个答案:

没有答案