Question

i’ve seen tons of posts on this but none work for some reason.

What I’m interested in is putting the stuff I type into a contenteditable <iframe> into a <textarea> and <div>.

here’s my HTML:

<textarea ></textarea>
<iframe></iframe>
<div></div>

here’s my JS:

var iframeBody=$('iframe').contents().find('body');
iframeBody.attr('contenteditable', true);

$(document.body).on( 'keyup', iframeBody, function() {   
  var txt = $(this).html();
  $('div').html(txt);
  $('textarea').val(txt);
});

​
here’s the JSfiddle if you’d like to make a suggestion: http://jsfiddle.net/nyPAM/21/

any help would be greatly appreciated, this thing is driving me nuts,

thanks,
tim

Answer 1

Try this:

var iframeBody=$('iframe').contents().find('body');
iframeBody.attr('contenteditable', true);

$(iframeBody).on( 'keyup',function() {
    var txt = $(this).html();
    $('div').html(txt);
    $('textarea').val(txt);
});

Demo: http://jsfiddle.net/GtXzz/