1

如您所见，左边的那个（没有初始化的 TinyMCE）工作得很好。 右边的那个（它有多个初始化的 TinyMCE）很不靠谱。

[左边和右边是同一页，只有右边显示了TinyMCE初始化后所有飞出Fancybox顶部的元素]

查看实时示例

我当前的设置有使用 AJAX 加载 PHP 页面的 Fancybox。页面选项卡（如上所示）是通过堆叠 DIV 并在左侧导航中的一个 LI 的 onclick 事件时将请求的一个向前移动来实现的。所有内部元素都是绝对定位的，定义了上/下和左/右。当 TinyMCE 不可用时，此设置可以正常工作。

当我初始化 TinyMCE 时，一切都乱套了。我偶尔会让它正确加载（在多个浏览器上），但在大多数情况下，它的作用类似于右上角的图像。我已经在谷歌上搜索了几个小时没有运气。我什至不知道从哪里开始。任何建议都会很棒！

HTML：

<div id="popup">
  <header>
    <a id="admin-link" class="fancybox" href="/dev/sbir/inc/login.php">[login]</a>
    <h1 id="head">Promote Value of SBIR</h1>
  </header>

  <ul id="nav">
    <li onclick="javascript:shiftUpContent(&quot;content_0&quot;);"><a href="#">Provide Success Stories</a></li>
    <li id="last"></li>
</ul>

  <div id="content">
    <div class="content" id="start">
      <h1>Directions</h1>
      <p>To view information on Promote Value of SBIR, select one of the sub-categories to the left.</p>
  </div>

  <div id="content_0" class="content">
    <h1>Provide Success Stories</h1>
    <p>Give Overview Presentation</p>
<ul>
  <li>It is a typical government contract</li>
  <li>It is competitive and I have to "beat someone else out"</li>
  <li>I don't have a chance against the big government contractors</li>
</ul>
<p>Other promotional strategies could include:</p>
<ul>
  <li>Conversations with current/past award winners</li>
  <li>Dr. Google assignments or in vivo browsing with client</li>
</ul>
<h2>Training Classes</h2>
<p>Search "SBIR Training", "SBIR Conferences", "SBIR Calendar" or "SBIR and name of an agency i.e. USDA, Navy, Army, etc" Some SBIR consultants give training classes from time to time as a way to solicit clients.</p>
<h2>External Content</h2>
<p><span style="text-decoration: underline;"><a href="/dev/sbir/www.zyn.com" target="_blank">www.zyn.</a>com</span><br> <a href="/dev/sbir/www.sbir.gov" target="_blank">www.sbir.guv</a></p>
</div>
</div>

JavaScript：

/* navigate through tabs of pop-up */
function shiftUpContent(id){
    topContent.style.zIndex = '5';
    if((topContent = document.getElementById(id)) === null){ return; }

    topContent.style.zIndex = '9998';
}

jQuery插件初始化：

$(document).ready(function() {
    $(".fancybox").fancybox({
        fitToView       : true,
        nextClick       : false,
        closeClick      : false,
        arrows          : false,
        mouseWheel      : false,
        width           : '773px',
        height          : '630px',
        type            : 'ajax',
        beforeShow      : function(){ 
            topContent  = document.getElementById("start");
            document.title  = titleRoot;
            $("#popup .fancybox").fancybox({
                fitToView       : true,
                autoSize        : true,
                nextClick       : false,
                closeClick      : false,
                arrows          : false,
                mouseWheel      : false,
                type            : 'iframe',
                ajax            : {
                                    type    : 'POST',
                                    cache   : false,
                                    success : function(data){
                                        $.fancybox(data);
                                    }
                                  }
            });
            tinyMCE.init({
                mode        : "textareas",
                relative_urls   : false,
                constrain_menus : true
            });
        }
    });
});

我试图尽可能多地去除不相关的代码，但不知道问题所在，很难知道需要留下什么。

4

1 回答 1

0

好吧，经过大约 7 个小时的调试，我仍然一无所获。有时设置有效，有时无效。

我的修复最终是返回 iframe 而不是 AJAX 来加载花式框。将 TinyMCE 实例与父页面完全隔离意味着每次关闭花式框时它们都会完全死掉（一切都像梦一样工作。我将不得不这样做。

使用此代码：

var i, t = tinyMCE.editors;
for (i in t){
    if (t.hasOwnProperty(i)){
        t[i].remove();
    }
}

我能够在fancybox 上的关闭之前删除所有实例，但这似乎对解决我的问题没有任何影响。

于 2012-07-25T16:22:15.870 回答