TinyMCE->无法读取属性'setAttribute'为null
TinyMCE -> Cannot read property 'setAttribute' of null
所以我正在制作一个需要HTML输入框的MVC网站。我有一个从ajax对话框窗口加载的文本区域。我知道TinyMCE需要我在隐藏对话框时删除控件,这很好。
然而,我根本无法加载编辑器。我使用的是带有jquery模块的4.1.9版本(2015-03-10)。即tinymce.jquery.js&jquery.tinymce.min.js
一旦对话框窗口打开,我就称之为;
$("textarea").tinymce({
// General options
mode: "textareas",
theme: "modern",
// Theme options
menubar: false,
toolbar: "bold,italic,underline,|,bullist,numlist",
statusbar: false,
init_instance_callback: function (editor) {
console.log("tinymce init: " + editor.id);
}
});
但我在下面的方法中的javascript中得到了一个异常,它似乎是self.ariaTarget未定义的,导致启动elm.setAttribute的行失败,因为elm为null
我不明白我做错了什么。
/**
* Sets the specified aria property.
*
* @method aria
* @param {String} name Name of the aria property to set.
* @param {String} value Value of the aria property.
* @return {tinymce.ui.Control} Current control instance.
*/
aria: function(name, value) {
var self = this, elm = self.getEl(self.ariaTarget);
if (typeof value === "undefined") {
return self._aria[name];
} else {
self._aria[name] = value;
}
if (self._rendered) {
elm.setAttribute(name == 'role' ? name : 'aria-' + name, value);
}
return self;
},
谢谢你的帮助
标记
编辑:
我一直在关注这个jsfiddlehttp://jsfiddle.net/thomi_ch/m0aLmh3n/19/而不是将tinymce与文档一起加载,而是在初始化时从url加载(见下文)。我已经更改了代码,使用与示例相同的script_url,它可以渲染编辑器(由于找不到css而缺少图标等),但这意味着我的tinymce.jquery.js文件版本有问题。
$('textarea').tinymce({
script_url : 'http://demo.nilooma.com/system/plugins/tinymce/4.1.6/tiny_mce/tinymce.gzip.php',
toolbar: 'link',
plugins: 'link',
forced_root_block : '',
init_instance_callback: function(editor) {
console.log('tinymce init: '+editor.id);
}
});
我已经试过了tinymce.jquery.js&tinymce.js版本4.1.9&4.1.6和jsfiddle使用的一样,所有的组合都给了我相同的错误
是否可能与其他库不兼容?
我找到了这个问题的解决方案。我相信这是由于多次尝试初始化元素造成的,之后我还发现了一个缺陷,即元素在隐藏时没有显示编辑器。
我用来初始化引导模式的代码是这样的;
$("#myModal").modal({
keyboard: true
}, "show");
//Bind open
$("#myModal").on("show.bs.modal", function () {
$(document).trigger("DialogLoaded");
});
//Bind close
$("#myModal").on("hidden.bs.modal", function () {
$(document).trigger("DialogClosed");
});
然后我听文件上的事件;
tinyMCE.init({
// General options
mode: "textareas",
theme: "modern",
// Theme options
menubar: false,
toolbar: "bold,italic,underline,|,bullist,numlist",
statusbar: false,
init_instance_callback: function(editor) {
console.log("tinymce init: " + editor.id);
}
});
$(document).on("DialogLoaded", function () {
var textAreas = $("textarea", $("#myModal"));
for (var i = 0; i < textAreas.length; i++) {
//Check if element already has editor enabled
if (tinymce.get(textAreas[i].id)) {
//Remove existing editor
tinyMCE.execCommand("mceRemoveEditor", false, textAreas[i].id);
}
//Add editor
tinyMCE.execCommand("mceAddEditor", false, textAreas[i].id);
}
});
$(document).on("DialogClosed", function () {
//Remove all editors in dialog
var textAreas = $("textarea", $("#myModal"));
for (var i = 0; i < textAreas.length; i++) {
//Check if element already has editor enabled
if (tinymce.get(textAreas[i].id))
tinyMCE.execCommand("mceRemoveEditor", false, textAreas[i].id);
}
});
我想有几点需要记住;
- 仅在可见元素上加载tinyMCE
- 首先初始化tinyMCE
- 确保每个元素只加载一次
- 确保每个文本区域都有一个唯一的id(并在隐藏后将其删除)
我希望这能帮助其他有TinyMCE问题的人。
谢谢,
做记号
- RegEx删除空属性?例如,如果(class=“”||class=“”)移除;否则就下课
- 全局变量和全局对象的属性之间有什么区别吗
- 如果使用 lodash 将属性存在于另一个对象中,则向对象添加属性
- 如何在Bootstrap Modal中为动态点击生成的变量设置jade属性
- 序列化数据属性中对象的最可靠方法
- 分析高度属性时出现意外值{{specs.height}}.index.html
- TypeError:无法读取属性'推'未定义的JavaScript
- 同样,同样的错误'ahorcado.js:26未捕获类型错误:无法读取属性'beginPath'
- AngularJS-使用'true'属性
- 可以't使用JavaScript获取width属性
- 未捕获的TypeError无法读取未定义的属性socialsharing
- TinyMCE->无法读取属性'setAttribute'为null
- Javascript setAttribute与jquery多属性setter
- 如何在IE8上使用setAttribute而不是使用style.cssText来更改样式属性
- 我应该使用 setAttribute 向元素添加属性吗?
- JS - 无法读取 null 的属性 'setAttribute'
- jQuery无法读取属性'setAttribute'的未定义
- 通过property或setAttribute设置属性
- IE9 错误:对象不支持属性或方法“setAttribute”
- 可以使用DOM's setAttribute函数设置多个属性吗?