关于jquery:TinyMce与Facebox

TinyMce with Facebox

我在Facebox模式弹出窗口内的文本框中使用tinymce时遇到一些问题。我正在尝试执行以下操作-

  • 我在其中加载tinymce.min.js javascript文件并也在执行tinyMCE.init()的父页面。
  • 父页面上有一个按钮,单击按钮后,我调用了一个javascript函数进行ajax调用,并在面板中显示了来自ajax调用的返回html。
  • 从ajax调用返回的HTML中有一个文本框,我需要成为tinyMCEd。
  • 我有一个已注册的事件处理程序,该事件处理程序已绑定到事件afterReveal.facebox-从文档中看起来像在渲染面框之后调用了该事件处理程序(尽管文档不是很清楚)
  • 在上面的事件处理程序中,我有以下代码-

    tinyMCE.execCommand('mceAddControl',true,'new-outline')

new-outline是文本区域的ID,需要为tinyMCEd。

我没有收到任何JS错误,并且textarea变成了tinymce编辑器。但是,编辑器跳出了面板(在右侧),并且只有一部分编辑器可见。

如果我没有将其缩小,则textarea会在facebox中正确呈现。

我该如何纠正?


由于CSS中的某些样式问题,我正面临这个问题。如果您想做这样的事情,我所描述的方法是实现此目标的最佳方法。


确保在facebox.js

中出现以下行

1
2
3
4
5
6
7
8
9
reveal: function(data, klass) {
      $(document).trigger('beforeReveal.facebox')
      if (klass) $('#facebox .content').addClass(klass)
      $('#facebox .content').empty().append(data)
      $('#facebox .popup').children().fadeIn('normal')
      $('#facebox').css('left', $(window).width() / 2 - ($('#facebox .popup').outerWidth() / 2))
      // Below Line
      $(document).trigger('reveal.facebox').trigger('afterReveal.facebox'); // This Line
    }

然后您的facebox弹出页面,您必须使用以下代码。

1
2
3
4
$(document).bind('afterReveal.facebox', function() {
    tinyMCE.execCommand('mceAddControl', true, 'content');
    // Here 'content' is editor (textarea) id
});

注意:不需要在弹出的面板中初始化tinyMCE配置。


最好的方法是向我们展示您的tinymce的完整初始化配置。
如果编辑器未显示,并且使用开发人员控制台没有任何JavaScript错误,则很可能您的tinymce配置是错误的。