jQuery .ajax() 正在打破 TinyMCE 3.5.6

Question

我用多层 jQuery.ajax() 构建了一个简单的 CMS，如下所示：

function navto(destination, pageToEdit, insertInto) {
// use JQuery's ajax method to control main navigation
if (pageToEdit == "undefined") {
    var request = $.ajax({
        url: destination
    });
} else {
    var request = $.ajax({
        type: "POST",
        url: destination,
        data: pageToEdit
    });
}

request.done(function(msg) {
    if (insertInto) { $(insertInto).html( msg ); }
    else { $("#mana_content").html( msg ); }
    //alert(msg);
});

request.fail(function(jqXHR, textStatus) {
    alert( textStatus + ". This page could not be found." );
});
}

例如index.php使用<li class="child" onclick="navto('inc/edit_pages.php');">Edit Pages</li>将edit_pages.php加载到<div id="content"></div>中

edit_pages.php 使用$(document).on("click", "a.editPage", function(e) { load_page_for_edit(e); return false; });（其中load_page_for_edit() 收集并准备要发送到navto() 函数的信息）发送类似edit_page.php?t=template.php&c=contentID 的内容

edit_page.php 使用这些值在相应的数据库中查找所需的信息，然后将template.php&c=content 之类的内容输出到它自己的<div id="page_to_edit"></div>... 再次与另一个navto()。

然后用户可以单击 $('.edit_text') 元素来取消隐藏带有 TinyMCE 文本区域（称为 $('#editor')）的 div。

内容被var content = $('.edit_text').html()捕获

问题是：当我尝试将内容变量加载到 TinyMCE 文本区域时——$('#editor').html(content);——文本区域没有收到它。我可以立即用alert($('#mana_editor').html()); 跟进，它输出正确的内容，但HTML 字符是安全的（例如，<p> 变成<p&rt;）。但是，内容不会加载到 TinyMCE。

我猜我有一个 .ajax 范围问题？也许 jQuery 正试图 $('#editor').html(content); 到 template.php 上不存在的 #editor（回想一下 #editor 在 edit_page.php 上）？有什么好的资源可以找出多层 .ajax 吗？

花絮、线索和我尝试过的事情：

• 我所有的 jQuery 函数都在一个 functions.js 文件中，除了 TinyMCE init，它位于 edit_page.php 的末尾。
• 只有 index.php 链接到 functions.js
• 我正在使用 TinyMCE 3.5.6、jQuery plugin package 和 jQuery 1.7.2。
• 我也尝试过 TinyMCE 的伪选择器（$('textarea:tinymce') 而不是 $('#editor')），这会在 Firebug 中引发错误：jq.min.js 中的“错误：语法错误，无法识别的表达式：tinymce”（行4).
• 用户在 TinyMCE 中进行更改后，更新按钮会将新内容加载到单击的$('.edit_text') 中。它不是加载我输入的内容，而是加载上面提到的“安全”HTML——就好像 TinyMCE 完全被绕过了一样。
• 如果我不使用整个 CMS，而是先在 FireFox 中手动键入 `get_page.php?t=template&c=content'，它就可以正常工作。
• 如果我不加载 TinyMCE，jQuery 会将内容加载到 textarea 中
• This guy 可能正在做某事......看起来很相似，但我不确定他的 head.js 包含什么，如何实现 head.ready();，或者他的问题是否与我的相同。

这是我第一个使用 Ajax 的项目，所以我有很多东西要学。任何见解/建议阅读/解决方案将不胜感激！

Answer 1

问题是：当我尝试将内容变量加载到 TinyMCE textarea -- $('#editor').html(content); -- textarea 确实 没有收到。我可以立即跟进 alert($('#mana_editor').html());，输出正确的内容， 但使用安全的 HTML 字符（例如，

变成

您需要知道 tinymce 不等于您的 textarea。 在初始化编辑器实例时，前文本区域被隐藏，tinymce 创建一个可内容编辑的 iframe - tinymce 编辑器。以前的文本区域会不时根据编辑器的实际内容进行更新（在特殊事件中）。 所以我认为你想要实现的是将你的内容写入编辑器。为此，使用 jQuery 处理 textarea 是行不通的（正如您自己发现的那样）。 您需要在这里使用 javascript tinymce API：

tinymce.get('your_former_textarea_id_needs_to_be_here').setContent(content);