[英]jQuery Load TinyMCE 4 On Demand
I am trying to use jQuery to load TinyMCE 4 on-demand from a CDN with no avail. 我试图使用jQuery从CDN按需加载TinyMCE 4但无济于事。 I would like avoid loading TinyMCE when the page loads since it is a (relatively) bulky set of scripts, and instead I plan to trigger loading it when the user clicks a button.
我希望避免在页面加载时加载TinyMCE,因为它是一个(相对)庞大的脚本集,而我计划在用户单击按钮时触发加载它。 Here is what I have:
这是我有的:
HTML: HTML:
...
<script src='//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js'></script>
...
jQuery: jQuery的:
...
if (typeof TinyMCE == 'undefined') {
$.getScript('//tinymce.cachefly.net/4/tinymce.min.js', function() {
alert('Loaded!');
tinymce.init({
selector: 'textarea',
plugins: [
'autolink contextmenu image link table'
],
menubar: false,
statusbar: false,
toolbar: false
});
});
}
...
I can see that jQuery does indeed fetch the script, as I can see the network activity in my inspector. 我可以看到jQuery确实获取了脚本,因为我可以在检查器中看到网络活动。 The callback method is called, as I can see the
Loaded!
调用回调方法,因为我可以看到
Loaded!
dialog appear, but TinyMCE dies not initialize. 对话框出现,但TinyMCE没有初始化。 The JavaScript console does not show any errors.
JavaScript控制台不显示任何错误。
Any idea on how I can get TinyMCE to initialize? 关于如何让TinyMCE初始化的任何想法?
Thank you for your time. 感谢您的时间。
Tinymce can not resolve baseURL when loading dinamically, so we have to hardcode it. 在加载dinamically时,Tinymce无法解析baseURL,因此我们必须对其进行硬编码。
Add the following: 添加以下内容:
if (typeof tinymce == 'undefined') {
$.getScript('//tinymce.cachefly.net/4/tinymce.min.js', function () {
window.tinymce.dom.Event.domLoaded = true;
tinymce.baseURL = "//tinymce.cachefly.net/4";
tinymce.suffix = ".min";
tinymce.init({
selector: 'textarea',
plugins: ['autolink contextmenu image link table'],
menubar: false,
statusbar: false,
toolbar: false
});
});
}
change your code as following: 更改您的代码如下:
if (typeof tinymce == 'undefined') {
$.getScript('//tinymce.cachefly.net/4/tinymce.min.js', function () {
window.tinymce.dom.Event.domLoaded = true;
tinymce.init({
selector: 'textarea',
plugins: ['autolink contextmenu image link table'],
menubar: false,
statusbar: false,
toolbar: false
});
});
}
It is working for me. 它对我有用。 more info https://stackoverflow.com/a/13361509/392526
更多信息https://stackoverflow.com/a/13361509/392526
Quote from original question : 从原始问题引用 :
Any idea on how I can get TinyMCE to initialize?
关于如何让TinyMCE初始化的任何想法?
There is a problem with JQuery.getScript and tinyMCE , which I think is causing your trouble. JQuery.getScript和tinyMCE存在问题,我认为这会给您带来麻烦。 It took me a day to figure it out, so I thought I should mention on it here.
我花了一天时间搞清楚,所以我想我应该在这里提一下。
I can't say what is the best way to solve this little problem. 我不能说解决这个小问题的最佳方法是什么。 I found the following to do the trick for me (tinymce 4.2.7):
我找到了以下为我做的技巧(tinymce 4.2.7):
Open tinymce.min.js and search for the comment line ... 打开tinymce.min.js并搜索评论行...
// Get base where the tinymce script is located
Look a few lines down where you'll find the statement ... 看几行,你会发现声明......
src = scripts[i].src;
... which should be altered to ... ......应改为......
src = "http://yourdomain.com/path/to/tinymce/tinymce.min.js";
I've identified the cause. 我已经确定了原因。 But I'm not very happy with my solution.
但我对我的解决方案并不满意。 Maybe someone else will come up with a better one.
也许其他人会想出一个更好的。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.