我正在尝试显示绑定到observable的可编辑字段。我使用knockout加'contenteditable'属性(html5)。编辑字段后,其值应作为json字符串发布到服务器。
问题在于将值发布到服务器。我希望上传新编辑的值,但不是它我得到了旧的价值。
以下是jsfiddle问题的说明:link
查看:
<h2 contenteditable="true" data-bind="editableText: title, event: { change: valueChanged }"></h2>
editableText binder:
ko.bindingHandlers.editableText = {
init: function (element, valueAccessor) {
$(element).on('blur', function () {
var observable = valueAccessor();
observable($(this).text());
});
},
update: function (element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor());
$(element).text(value);
}};
'更改'事件触发器:
$('[contenteditable]').live('focus', function() {
var $this = $(this);
$this.data('before', $this.html());
return $this;
}).live('blur paste', function() {
var $this = $(this);
if ($this.data('before') !== $this.html()) {
$this.data('before', $this.html());
$this.trigger('change');
}
return $this;
}).live('keypress', function(e) {
var code = (e.keyCode ? e.keyCode : e.which);
if (code == 13) {
var $this = $(this);
if ($this.data('before') !== $this.html()) {
$this.data('before', $this.html());
$this.trigger('change');
}
e.preventDefault();
}
return $this;
});