I am trying to build a HTML,CSS, jQuery/JavaScript editor... How can I inject JavaScript or jQuery into an iFrame? I tried searching all related answers here, but none of the solutions is helping...
here's what I am talking about...#css, #js are textareas, while #iframe_id is an iframe used to preview the changes.
css_code = $('#css').val();
js_code = $('#js').val();
css_content = "<style>" + css_code + "</style>"; // working
js_content = "<script>" + js_code + "</script>"; // does not work
$('#iframe_id').contents().find('head').append(css_content); // working
$('#iframe_id').contents().find('body').append(js_content); // does not work
The following works but only if I use core JavaScript, not sure why...frame[0] basically is the same iframe (#iframe_id)...
var js_content = jsEditor.getValue();
frames[0].window.eval(js_content); // works only when JavaScript is entered (not jQuery)
It may be something to do with the 'script' tags, maybe jQuery has a problem with it...not sure why.
