Skip to content

Instantly share code, notes, and snippets.

@mudge
Created October 29, 2009 17:17
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mudge/221616 to your computer and use it in GitHub Desktop.
Save mudge/221616 to your computer and use it in GitHub Desktop.
A simple rich text editor with jQuery and iframe designMode.
/*
* A very basic rich text editor using jQuery and iframe designMode.
*
* In your HTML...
* <input type="hidden" id="article_body" name="article[body]">
* <iframe id="paste"></iframe>
*/
/*
* NOTE: The order of writing and setting designMode is very important.
* https://bugzilla.mozilla.org/show_bug.cgi?id=232791#c8
*
* document.write() has to be used for Internet Explorer as
* the document body will be null until it is first written to.
*/
(function() {
var body_document = $('#paste').contents().get(0);
body_document.open();
body_document.write($('#article_body').val());
body_document.close();
body_document.designMode = 'on';
})();
/* Copy the contents of the iframe into the form. */
$('form').submit(function() {
$('#article_body').val($('#paste').contents().find('body').html());
});
@BlackMoon
Copy link

sssss

@putrasurya
Copy link

wow, thanks bro, i had tried $("iframe").contents().prop("designMode", "on"); // but doesn't work on firework,
when i used your way, it's work. very thanks !

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment