jwysiwyg 文本区域的剔除绑定处理程序
所以我注意到 knockout js 与 jQuery jwysiwyg 插件不能很好地配合。
阅读此博客文章后: http:// www.knockmeout.net/2011/07/another-look-at-custom-bindings-for.html 这个答案: 如何使用 jQuery 检测对使用 jWYSIWYG 插件的文本区域内容的更改?
我编写了以下绑定处理程序:
ko.bindingHandlers.wysiwyg = {
init: function (element, valueAccessor, allBindingsAccessor) {
var options = allBindingsAccessor().wysiwygOptions || {};
var value = ko.utils.unwrapObservable(valueAccessor());
var $e = $(element);
$.extend(true, {
initialContent : value
}, options);
$e.wysiwyg(options);
//handle the field changing
function detectFn() {
var observable = valueAccessor();
var newvalue = $e.wysiwyg("getContent");
observable(newvalue);
}
var current = $e.wysiwyg('document');
var timer;
current.bind({
keyup: function(){
clearTimeout(timer);
timer = setTimeout(detectFn, 1000);
}
});
//handle disposal (if KO removes by the template binding)
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
$e.wysiwyg('destroy');
});
},
update: function (element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor());
$(element).wysiwyg("setContent", value);
ko.bindingHandlers.value.update(element, valueAccessor);
}
};
像这样使用:
<textarea data-bind="wysiwyg: yourViewModelValue"></textarea>
到目前为止它正在工作我,任何意见将不胜感激。
我认为这对于任何想要让 kockout js 和 jwysiwyg 一起绑定 textarea 元素的人来说都是有用的。
So I noticed knockout js doesn't play well with jQuery jwysiwyg plugin.
After reading this blog post: http://www.knockmeout.net/2011/07/another-look-at-custom-bindings-for.html
And this SO answer: How to detect a change with jQuery to the contents of a textarea that's using jWYSIWYG plugin?
I wrote the following binding handler:
ko.bindingHandlers.wysiwyg = {
init: function (element, valueAccessor, allBindingsAccessor) {
var options = allBindingsAccessor().wysiwygOptions || {};
var value = ko.utils.unwrapObservable(valueAccessor());
var $e = $(element);
$.extend(true, {
initialContent : value
}, options);
$e.wysiwyg(options);
//handle the field changing
function detectFn() {
var observable = valueAccessor();
var newvalue = $e.wysiwyg("getContent");
observable(newvalue);
}
var current = $e.wysiwyg('document');
var timer;
current.bind({
keyup: function(){
clearTimeout(timer);
timer = setTimeout(detectFn, 1000);
}
});
//handle disposal (if KO removes by the template binding)
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
$e.wysiwyg('destroy');
});
},
update: function (element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor());
$(element).wysiwyg("setContent", value);
ko.bindingHandlers.value.update(element, valueAccessor);
}
};
use like this:
<textarea data-bind="wysiwyg: yourViewModelValue"></textarea>
so far it's working for me, any comments will be appreciated.
I think this can be of use for anyone looking into getting kockout js and jwysiwyg working together on binding the textarea element.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论