jquery: getting contents of #content field on post page

Question

I managed to get the #content field html with this jquery call:

jQuery("#content").html()

This seems to be failing though on "Add New Post" pages. Any tips on how to get the contents of the #content div?

Cheers

Answer 1

The div #editorcontainer contains a regular textarea #content and an iframe #content_ifr.

The #content is filled with the saved contents of the post when the page loads. This means that any live edits of the content won't be returned when calling jQuery("#content").html(). For the same reason, you get an empty string in the case of a new post.

Where you really need to look for the live updated contents is in the iframe, which is used by the WYSIWYG editor. Here's how:

jQuery('#content_ifr').contents().find('#tinymce').html();

Also see: jquery/javascript: accessing contents of an iframe.

Answer 2

my code works fine in this form:

tinyMCE.triggerSave();
txt = $('#myTextarea')
    .contents()
    .find('#tinymce')
    .html()
    .replace('<br data-mce-bogus="1">', '')
;
if (console && console.log) console.log(txt);