twitter-bootstrap JQuery - 无法读取未定义的属性“编辑器”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20255299/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery - cannot read property 'Editor' of undefined
提问by user2859066
I'm trying several WYSIWYG HTML5/JQuery editors. However, with both Bootstrap WISWYG and Summernote, I get 'cannot read property 'fn' of undefined' or 'cannot read property 'Editor' of undefined. I'm just using the standard files out there on GitHub. Anyone familiar with these errors using JQuery plugins?
我正在尝试几个 WYSIWYG HTML5/JQuery 编辑器。但是，使用 Bootstrap WISWYG 和 Summernote，我得到“无法读取未定义的属性‘fn’”或“无法读取未定义的属性‘编辑器’”。我只是使用 GitHub 上的标准文件。任何人都熟悉使用 JQuery 插件的这些错误？
EDIT
编辑
I'm now trying Bootstrap WISWYG
我现在正在尝试Bootstrap WISWYG
Within my body I have
在我的身体里我有
<div id="editor">Editor</div>
In my js, I have
在我的js中，我有
$(document).ready(function() {
$('#editor').wysihtml5();
});
However, the error I get is: Cannot read property 'Editor' of undefined (line 157)
但是，我得到的错误是：无法读取未定义的属性“编辑器”（第 157 行）
Line 157:
第 157 行：
var editor = new wysi.Editor(this.el[0], options);
JSFiddle: http://jsfiddle.net/MgcDU/8125/
JSFiddle：http: //jsfiddle.net/MgcDU/8125/
EDIT 2
编辑 2
I forgot to include one JS file. However, after including it I get a new error:
我忘了包含一个 JS 文件。但是，在包含它之后，我收到一个新错误：
Uncaught TypeError: Cannot read property 'firstChild' of undefined
The lines of code that the error refers to:
错误所指的代码行：
if (isString) {
element = wysihtml5.dom.getAsDom(elementOrHtml, context);
} else {
element = elementOrHtml;
}
while (element.firstChild) <<<Error
回答by José SAYAGO
The thing is you are using a DIVelement instead of a textareathere are also dependencies missing. Checking the Bootstrap WYSIHTML5 page it says:
问题是您正在使用一个DIV元素而不是一个textarea也缺少依赖项。检查 Bootstrap WYSIHTML5 页面，它说：
Dependencies:
- bootstrap-wysihtml5.js
- bootstrap-wysihtml5.css
- wysihtml5
- Twitter Bootstrap
依赖项：
- bootstrap-wysihtml5.js
- bootstrap-wysihtml5.css
- 所见即所得
- 推特引导程序
Then your document should look something like:
那么你的文档应该是这样的：
<!DOCTYPE html>
<header>
<title>HTML5 Editor</title>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- Of course place sources in your own server, do not leech bandwidth -->
<script type="text/javascript" src="http://jhollingworth.github.io/bootstrap-wysihtml5/lib/js/wysihtml5-0.3.0.js"></script>
<script type="text/javascript" src="http://jhollingworth.github.io/bootstrap-wysihtml5/lib/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://jhollingworth.github.io/bootstrap-wysihtml5/src/bootstrap-wysihtml5.js"></script>
<link rel="stylesheet" type="text/css" href="http://jhollingworth.github.io/lib/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="http://jhollingworth.github.io/src/bootstrap-wysihtml5.css">
</header>
<body>
<textarea class="editor"></textarea>
<script type="text/javascript">
$(document).ready(function(){
$('.editor').wysihtml5();
});
</script>
</body>
For further reference, please check: Wysihtml5 #Usage
如需进一步参考，请查看：Wysihtml5 #Usage
回答by Faron
"cannot read property 'fn' of undefined"
usually means that the script does not have script being loaded into DOM. You might are missing jQuery file? I have often noticed that it is becoming a practice for jQuery scripts to be loaded right in the bottom of HTML, right before
通常意味着脚本没有将脚本加载到 DOM 中。您可能缺少 jQuery 文件？我经常注意到，在 HTML 底部加载 jQuery 脚本正成为一种习惯，就在
</body>
But, it always works so well if I loaded only one Jquery file in header meanwhile the rest of other jquery plugin scripts loaded in the bottom of the html file.
但是，如果我只在标题中加载一个 Jquery 文件，同时在 html 文件的底部加载其他其他 jquery 插件脚本，它总是很好用。
