删除绑定和CK编辑器工具栏不显示
Knockout binding and CK Editor toolbar not appearing
我是全新的敲出自定义绑定,我正试图将ckeditor与敲出绑定集成,我有以下绑定从谷歌搜索,
ko.bindingHandlers.wysiwyg = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
var value = valueAccessor();
var valueUnwrapped = ko.unwrap(value);
var allBindings = allBindingsAccessor();
var $element = $(element);
$element.attr('contenteditable', true);
if (ko.isObservable(value)) {
var isSubscriberChange = false;
var isEditorChange = true;
$element.html(value());
var isEditorChange = false;
$element.on('input, change, keyup, mouseup', function () {
if (!isSubscriberChange) {
isEditorChange = true;
value($element.html());
isEditorChange = false;
}
});
value.subscribe(function (newValue) {
if (!isEditorChange) {
isSubscriberChange = true;
$element.html(newValue);
isSubscriberChange = false;
}
});
}
}
}
我有以下代码要绑定,
$(function () {
$.getJSON("/getdata", function (data) {
ko.applyBindings({
testList: [{
test: ko.observable()
},
{
test: ko.observable()
}]
}, document.getElementById('htmled'));
});
});
HTML如下
<div id="htmled" data-bind="foreach:testList">
Data
<div class="editor" data-bind="wysiwyg: test">Edit this data</div>
</div>
当我调用ko时,绑定工作并显示工具栏。$之外的applyBindings。getJSON方法。但当我在内部调用applyBindings时,工具栏没有出现。有人能帮我吗?我肯定是遗漏了什么,任何帮助都是非常感谢的。
Jsfiddle添加
工作:http://jsfiddle.net/jogejyothish/h4Lt3/1/不工作:http://jsfiddle.net/jogejyothish/Se8yR/2/
Jyothish
是这样的:
- 您的页面加载为单个div。KO尚未应用于此div。
- document.ready()火灾。CKEditor脚本应用CKEditor到任何匹配的div (none)。
- 进行ajax调用。 Ajax调用完成。
- KO插入了两个新的div,它们都没有CKEditor。
$(".editor").each(function(idx, el) {
CKEDITOR.inline(el)
});
在这里,在你的小提琴上工作:
http://jsfiddle.net/Se8yR/5/你的工作版本工作的原因是因为绑定应用在文档中。ready,因此KO及时呈现两个div元素,并且CKEditor成功应用于它们。
CKEditor需要一些时间来加载。
在第一个示例中,它在ko应用之后加载,这很好。
在第二个示例中,它在ko应用之前加载。问题是CKEditor查找您用ko设置的contenteditable
属性,因此没有创建编辑器。
可以手动创建:
CKEDITOR.inline(element).setData(valueUnwrapped || $element.html());
医生
相关文章:
- 在某些URL上显示火狐插件工具栏
- 在 Rails 上初始化应用程序 CSS 和 JavaScript 标签时,未显示 FullCalendar 标题工具栏
- KendoUI 工具栏拆分按钮会自动突出显示下拉列表中的第一个选项.如何使所有选项看起来相同
- 当我使用 ckeditor 工具栏时,它会添加 html 标签,而不是在显示时添加所需的效果
- 创建JS工作,但不显示工具栏
- TinyMCE 4在IE9(任何模式)中不显示工具栏图标
- 仅当具有 1 个工具栏的多个编辑器的编辑器处于焦点中时,才显示 TextAngular 工具栏
- 如何在我的WinJS工具栏上显示标签
- 隐藏和显示剑道ui编辑器工具栏
- 外部网格分页工具栏不显示在IE上
- 如何更新web探查器工具栏以显示有关ajax请求的数据
- 如何选择性地显示Chrome扩展'的工具栏图标
- js右侧工具栏未显示
- 删除绑定和CK编辑器工具栏不显示
- 启用/禁用ExtJS面板中基于活动显示的工具栏按钮
- Froala WYISWYG编辑器不显示工具栏
- 如何在 CKEDITOR 内联中禁用自动隐藏/显示工具栏
- tinymce文本编辑器中没有显示工具栏
- 从该工具栏中显示FireFox工具栏'
- ExtJS网格分页工具栏显示错误的页数