Question

我使用的是最新版本的TinyMCE 4.0b3。 Jquery版本是1.9.1。下面是我的代码：

<script type="text/javascript" src="tinymce/tinymce.min.js"></script>
<script type="text/javascript">
  tinymce.init({
  selector: "textarea",
  theme: "modern",
  plugins: [
  "advlist autolink lists link image charmap print preview hr anchor pagebreak",
  "searchreplace wordcount visualblocks visualchars code fullscreen",
  "insertdatetime media nonbreaking save table contextmenu directionality",
  "emoticons template paste textcolor"
  ],
  toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
  toolbar2: "print preview media | forecolor backcolor emoticons",
  image_advtab: true,
  templates: [
   {title: 'Test template 1', content: 'Test 1'},
   {title: 'Test template 2', content: 'Test 2'}
  ],
 });
 </script>

 <textarea name="content" rows="5" cols="100"/>

以上代码在IE9标准模式下完美运行。但不是在IE9兼容模式下，mozilla firefox，google chrome，safari。我没有在浏览器控制台中看到任何错误。

我看到这么多关于这个问题的帖子应该在解决这个问题之后加载jquery。但是在我们的应用程序中，我们不能这样做，因为jquery是在主页本身加载的。

我曾尝试使用$（document）.ready函数但没有用。我不确定它是否是jquery问题。

修改：上面的代码在所有浏览器的普通html文件中都能正常工作。在我们的应用程序中，我们使用hbs（手把脚本）文件。当试图将该代码放入hbs文件时，它不起作用。

是否有其他方法可以解决此问题。

Answer 1

在我们的应用中，我们也使用require js。所以我们需要做shims配置才能使它工作。

requirejs.config({
baseUrl: "js",
paths: {
    tinyMCE: 'libs/tinymce/tiny_mce'
},
shim: {
    tinyMCE: {
        exports: 'tinyMCE',
        init: function () {
            this.tinyMCE.DOM.events.domLoaded = true;
            return this.tinyMCE;
        }
    }
}
});

参考：How can I implement TinyMCE with Require.js?

Answer 2

尝试将脚本代码放在body标记之后。

TinyMCE编辑器在使用Handlebar脚本文件和jquery时不使用chrome，mozilla firefox

2 个答案: