使用jQuery操作TinyMCE内容 [英] Manipulating TinyMCE content with jQuery

问题描述

使用TinyMCE，我可以轻松操作内容并将其发送回编辑器，如下所示：

With TinyMCE, I can easily manipulate content and send it back to the editor, like this:

    // get content from tinyMCE
    var content = tinyMCE.get('content').getContent();

    // manipulate content using js replace
    content = content.replace(/<\/?div>/gi, '');

    // send back to tinyMCE
    tinyMCE.get('content').setContent( content );

上述代码工作正常。但是，我不能让它工作：

The above code works fine. However, I can't get this to work:

    // get content from tinyMCE (it provides an html string)
    var content = tinyMCE.get('content').getContent();

    // make it into a jQuery object
    var $content = $(content);

    // manipulate the jquery object using jquery
    $content = $content.remove('a');

    // use a chained function to get its outerHTML
    content = $("<div />").append( $content.clone() ).html();               

    // send back to tinyMCE
    tinyMCE.get('content').setContent( content );

我的方法有问题吗？

推荐答案

设置和获取TinyMCE是正确的;问题在于我使用 .remove（）：

The setting and getting to TinyMCE was correct; the problem was with my use of .remove():

$content = $content.remove('a');

由于TinyMCE的内容是单个对象，不是集合对象中的一些是< a> 标签，该操作无效，并且返回的html与原始相同。

Since the content from TinyMCE was a single object, and not a collection of objects some of which were <a> tags, that manipulation had no effect, and the html that returned was the same as the original.

为了删除链接，我需要这样做：

In order to remove links, I instead needed this:

$content = $content.find('a').remove();

我收到了这个帖子的澄清： $（'＃foo'）。remove（'a'）和$（'＃foo'）之间的区别.find（'a' ）.remove（）

I received clarification in this thread: Difference between $('#foo').remove('a') and $('#foo').find('a').remove()

这篇关于使用jQuery操作TinyMCE内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！