如何在使用 jquery 进行 ajax 操作后清空 TINYMCE 内容

Posted

技术标签:

【中文标题】如何在使用 jquery 进行 ajax 操作后清空 TINYMCE 内容【英文标题】:How to empty TINYMCE content after ajax action with jquery 【发布时间】:2011-04-21 22:22:37 【问题描述】:

我使用 jquery ajax 函数在一些输入字段和文本区域中添加内容。只有 textare 使用 TINYMCE。

但是在 ajax 之后,TINYMCE 中的文本并没有刷新并保留。

如何使用 jquery 清空 TINYMCE 中的内容?

我当前的代码如下。

//on submit event
    $("#specformentry").submit(function(event)
        event.preventDefault();
        if(checkForm())
          //  var href = $(this).attr("href");
            submitinput.attr( disabled:true, value:"Sending..." );
            //$("#send").blur();
            //send the post to shoutbox.php
            $.ajax(
                type: "POST",
                url: "../../Ajaxinsertspec",
                data: $('#specformentry').serialize(),
                complete: function(data)
                     update_entry();
                     specdesc.val('');
                     datecreated.val('');
                     detailstext.val('');
               // this code is supposed to empty the INYMCE content, but it does not

                    //reactivate the send button
                    submitinput.attr( disabled:false, value:"Enter Spec" );
                
             );
        
        else alert("Please fill all fields!");
        //we prevent the refresh of the page after submitting the form
        return false;
    );

以下是html的一部分

<div id="enterlabel"><label for="spec_details">Click me to enter Spec Details</label></div>
<div style="display: block;" id="textarea">
<textarea style="display: none;" name="spec_details" cols="90" rows="12" id="detailstext"></textarea>
<span class="mceEditor defaultSkin" id="detailstext_parent">
    <table style="width: 100px; height: 100px;" class="mceLayout" id="detailstext_tbl" cellpadding="0" cellspacing="0">
        <tbody><tr class="mceFirst">
          <td class="mceToolbar mceLeft mceFirst mceLast"><a href="#" accesskey="q" title="Jump to tool buttons - Alt+Q, Jump to editor - Alt-Z, Jump to...
...

【问题讨论】:

【参考方案1】:

你不需要 jQuery 来清空 tinymce。通过 id 获取 tinymce 实例并将内容设置为 ''(等于空)使用

//第一个编辑器实例的id 页面位于 tinymce.editors[0].id

var tinymce_editor_id = 'my_tinymce_id'; 
tinymce.get(tinymce_editor_id).setContent('');

【讨论】:

谢谢解决了我的问题.. 【参考方案2】:

这对我有用:

tinyMCE.activeEditor.setContent('');

特别是如果它是您页面中存在的唯一编辑器。

【讨论】:

对我来说已经足够了,没有了!:) 这对我有用,而投票最多的解决方案却没有。【参考方案3】:

试试下面的代码

if (typeof(tinyMCE) != 'undefined')   
  $('#edit-comment').val('');  // Removes all paragraphs in the active editor   

【讨论】:

以上是关于如何在使用 jquery 进行 ajax 操作后清空 TINYMCE 内容的主要内容,如果未能解决你的问题,请参考以下文章

如何在 AJAX 调用后创建的格式化 HTML 上调用 JQuery 操作?

如何使用 JQuery .Ajax 进行 Pingdom 检查?

如何在使用 jQuery 进行 ajax 请求后替换页面的整个 CSS?

前端jQuery使用ajax与后端Servlet进行数据交互

JQuery Ajax - 如何在进行 Ajax 调用时检测网络连接错误

更改窗口位置 Jquery