首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >jQuery .ajax()破坏TinyMCE 3.5.6

jQuery .ajax()破坏TinyMCE 3.5.6
EN

Stack Overflow用户
提问于 2012-08-08 21:41:19
回答 1查看 944关注 0票数 2

我构建了一个包含多个jQuery.ajax()层的简单CMS,如下所示:

代码语言:javascript
运行
复制
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 textarea -- $('#editor').html(content); -- textarea没有收到它。我可以立即使用alert($('#mana_editor').html());进行跟踪,它输出了正确的内容,但是使用了安全的HTML字符(例如,<p>变成了&lt;p&rt;)。但是,内容不会加载到TinyMCE中。

我猜我有一个.ajax范围问题?也许jQuery正试图将$('#editor').html(content);转换为template.php上一个不存在的#编辑器(还记得#编辑器在edit_page.php上)吗?有什么好的资源来计算出多个.ajax层吗?

我尝试过的一些线索和东西:

  • 我所有的jQuery函数都在一个functions.js文件中,除了位于edit_page.php末尾的TinyMCE init之外。
  • 只有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,并开始手动键入`get_page.php?t=template&c=content‘到FireFox,它工作得很好。
  • 如果我不加载TinyMCE,jQuery将将内容加载到文本区域
  • 这家伙可能发现了什么..。看起来类似,但我不知道他的head.js包含什么、如何实现head.ready();或者他的问题是否与我的问题相同。

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

EN

回答 1

Stack Overflow用户

发布于 2012-08-09 07:33:15

问题是:当我试图将内容变量加载到TinyMCE文本区域时-- $(‘#编辑器’).html(内容);-- textarea没有接收到它。我可以立即使用警告($(‘#mana_editor’).html())来跟踪这一点,它输出正确的内容,但是使用HTML字符使其变得安全(例如, 变成

您需要知道,tinymce并不等于您的文本区域。在编辑器实例的初始化中,前textarea被隐藏,tinymce创建一个内容可编辑的iframe -- tinymce编辑器。前一个textarea会不时地使用编辑器的实际内容进行更新(关于特殊事件)。所以我认为你想要实现的是把你的内容写到编辑器里。要做到这一点,使用jQuery寻址文本区域是行不通的(正如您发现的那样)。您需要在这里使用javascript tinymce API:

代码语言:javascript
运行
复制
tinymce.get('your_former_textarea_id_needs_to_be_here').setContent(content);
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/11873612

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档