我正在使用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…?
}
};