0

I want to select an element in an Iframe that has no src element, since it is populated by javascript. Below is a general structure of the source code i have, with the latest JQuery script that I have tried. Still no luck. Am I missing something? Thanks

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
    var context = $('#listing_content_ifr')[0].contentWindow.document;
    var $body = $('#tinymce', context);
    $body.addClass('is-active'); 
});
</script>
<style>
    #tinymce {border: solid 1px #ccc; height:300px; width:300px;}
</style>
</head>

<body>
    <iframe id="listing_content_ifr" frameborder="0" allowtransparency="true" style="width: 100%; height: 402px; display: block;"> 
       <html>
        <head>
        </head>
            <body id="tinymce" contenteditable="true">
                <p><br data-mce-bogus="1"></p>
            </body>
        </html>                
    </iframe>

</body>

</html>
RobbTe
  • 385
  • 4
  • 19
  • You need to put the ` – Barmar Jul 16 '18 at 21:16
  • Not sure about that; I have just created this as a test file. – RobbTe Jul 16 '18 at 21:29
  • As far as I can tell, you can't put inline contents in an iframe like that. The contents are only shown if the browser doesn't support iframes. If you want to display something in an iframe that isn't loaded using `src`, you have to use `context.write()`. – Barmar Jul 16 '18 at 21:39
  • See http://jsfiddle.net/barmar/tsp8nhqy/19/ – Barmar Jul 16 '18 at 21:44
  • i know. The above code is the frontend source code. The iFrame contents are being written by javascript. So I am looking for a jquery script that is able to select an element from the iFrame, that is being generated by javascript. – RobbTe Jul 16 '18 at 21:52
  • I think your method of selecting the element should work. – Barmar Jul 16 '18 at 21:54
  • Hi, sadly it does not. On my live site the – RobbTe Jul 16 '18 at 21:59
  • It shouldn't matter. See this fiddle, it shows that you can access nested elements. http://jsfiddle.net/barmar/tsp8nhqy/24/ – Barmar Jul 16 '18 at 22:07
  • @Barmar, that works thanks. What about selecting an element in the iframe and adding the class 'is-active', as a document ready function? – RobbTe Jul 17 '18 at 11:06
  • Once you select the element I think you should be able to do anything to it, including adding classes. – Barmar Jul 17 '18 at 15:11
  • See http://jsfiddle.net/barmar/tsp8nhqy/36/ I use DOM methods, but there's no reason to believe that the analogous jQuery methods won't work just as well. – Barmar Jul 17 '18 at 15:15
  • This helped me: https://stackoverflow.com/questions/8233278/jquery-onload-load-event-not-working-with-a-dynamically-loaded-iframe Thanks – RobbTe Jul 17 '18 at 15:40
  • But you're not using `src`, so that's not relevant. You're loading the iframe with `.write()` in the main page, this is synchronous. – Barmar Jul 17 '18 at 15:42
  • I need to use it so i can use the load function, only that way i am able to select elements from the iframe. Found this, since an onclick action did allow me to select elements – RobbTe Jul 17 '18 at 15:44

0 Answers0