2

我用多层 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>变成&lt;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 插件包和 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
  • 这家伙可能正在做某事......看起来很相似，但我不确定他的 head.js 包含什么，如何实现 head.ready();，或者他的问题是否与我的相同。

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

4

1 回答 1

2

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

变成 <p&rt;)。但是，内容不会加载到 TinyMCE。

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

tinymce.get('your_former_textarea_id_needs_to_be_here').setContent(content);
于 2012-08-09T07:33:15.000 回答