3

我正在尝试使用 jQuery 从 CDN 按需加载 TinyMCE 4,但无济于事。我想避免在页面加载时加载 TinyMCE,因为它是一组(相对)庞大的脚本,而是我计划在用户单击按钮时触发加载它。这是我所拥有的:

HTML:

...
<script src='//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js'></script>
...

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
    });
  });
}
...

我可以看到 jQuery 确实获取了脚本,因为我可以在我的检查器中看到网络活动。回调方法被调用,我可以看到Loaded!对话框出现,但 TinyMCE 没有初始化。JavaScript 控制台不显示任何错误。

关于如何让 TinyMCE 初始化的任何想法?

感谢您的时间。

4

3 回答 3

4

Tinymce 在动态加载时无法解析 baseURL,因此我们必须对其进行硬编码。
添加以下内容:

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
        });
    });
}
于 2015-11-12T13:04:25.870 回答
0

更改您的代码如下:

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
            });
        });
    }

它对我有用。更多信息https://stackoverflow.com/a/13361509/392526

于 2013-07-17T11:31:38.050 回答
0

引用原始问题

关于如何让 TinyMCE 初始化的任何想法?

JQuery.getScripttinyMCE存在问题,我认为这会给您带来麻烦。我花了一天的时间才弄清楚,所以我想我应该在这里提一下。

  1. $.getScript添加和删除您正在加载的脚本,在此过程中执行它的内容。因此,当您的成功函数运行 tinymce.init 时,脚本标签不再存在于您的文档中。
  2. 另一方面, tinymce.init 会在您的文档中查找该特定脚本标记,以了解其所有文件的基本 URL。如果它没有找到它,它将改为从 document.location 获取它。

我不能说解决这个小问题的最佳方法是什么。我发现以下内容可以为我解决问题(tinymce 4.2.7):

打开tinymce.min.js并搜索注释行...

            // Get base where the tinymce script is located

往下看几行,你会发现语句......

            src = scripts[i].src;

...应该改为...

            src = "http://yourdomain.com/path/to/tinymce/tinymce.min.js";

我已经确定了原因。但我对我的解决方案不太满意。也许别人会想出一个更好的。

于 2016-02-13T20:09:47.633 回答