locked
automatically populate contenteditable iframe in Firefox with Javascript RRS feed

  • Question

  • User2146470223 posted

    Hi,

    I finally managed to get contenteditable to work on an iFrame in Firefox but only if it is populated manually via a function, if I try to run the function automatically when loading the page, the test string appears for about a few miliseconds in the iFrame but then it is set to empty immediately and I don't know why. In IE it works fine.

    the test string I want to insert wrapped in Javascript:

                    var iframeBody = $("#test").contents().find("body");
                    var styleTag = iframeBody.append('<div><b>hi</b></div>');

    my iFrame:

    <p><iframe id="test" style="width:540px; max-width:540px; max-height:200px; resize:none" designmode="on" contenteditable="true"></iframe></p>

    I know that designmode and contenteditable should be set somewhere else than in the iFrame tag for HTML5 but up to now I don't know how to get it into the body tag of the iFrame with Javascript. But that is another question.

    first I would like to be able to set the text on pageload or similar.

    Thanks for your help in pointing out what I missed. ;)

    Pascal

    Wednesday, January 4, 2017 8:08 PM

Answers

  • User2146470223 posted

    Hi,

    I found a working solution:

                    var doc = document.getElementById('test').contentWindow.document;
                    doc.open();
                    doc.write('<head><link href="https://www.translating-it.eu/spellcheck.css" type="text/css" rel="stylesheet" /></head>');
                    doc.write(mytool_array2[1]);
                    doc.close();

    I even can change tag and everything with this.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, January 5, 2017 12:49 PM

All replies

  • User2146470223 posted

    Ok, just found out that this has to do with the iFrame being empty.

    Trying a plain javascript version offers some result and afterwards the jquery function also works like a charm.

    How can that be?

    Wednesday, January 4, 2017 8:33 PM
  • User2146470223 posted

    Hi,

    I found a working solution:

                    var doc = document.getElementById('test').contentWindow.document;
                    doc.open();
                    doc.write('<head><link href="https://www.translating-it.eu/spellcheck.css" type="text/css" rel="stylesheet" /></head>');
                    doc.write(mytool_array2[1]);
                    doc.close();

    I even can change tag and everything with this.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, January 5, 2017 12:49 PM