Question

我正在尝试将HTML绑定到div元素，使用某种编辑就地编辑器编辑该div的内容，单击保存按钮并检索新内容，但我没有成功。

视图如下所示：

<div id="content" data-bind="html: content"></div>
<button data-bind="click: function(){ save() }">Save</button>

使用此Javascript：

var viewModel = {
    content: ko.observable("<h3>Test</h3>"),
    save: function(){
        console.log(ko.toJSON(viewModel));    
    }
}

$(function(){
    ko.applyBindings(viewModel);
    $("#content").html("<h4>Test</h4>");
    ko.applyBindings(viewModel,document.getElementById('content'));
});

另见this jsfiddle。

当我点击保存时，控制台仍然显示<h3>Test</h3>。

我可以做我想做的事吗？

Answer 1

html绑定不会设置任何事件处理程序来捕获更改，因为它通常放在不可编辑的元素上。

以下是使用contenteditable属性的示例：http://jsfiddle.net/rniemeyer/JksKx/（来自此主题）。

如果您希望与TinyMCE等编辑器集成，那么这里有一个示例：http://jsfiddle.net/rniemeyer/GwkRQ/（来自此主题）。

监视对html绑定内容的更改

1 个答案: