jQuery: Access frame in nested frameset

前端 未结 3 1622
说谎
说谎 2020-12-15 09:33

I have a document which has a nested frameset. I need to access one of the nested frames, named \"sq_main\", and access content inside this frame. Here is my structure:

相关标签:
3条回答
  • 2020-12-15 09:43

    Try to navigate one step at a time. IIRC, the frames array only works with iframes. Try the selector frame[name = 'sq_main'] instead.

    Example by Ronny Sherer:

    var frameDocument = $('frame[name="mainFrame"]', top.document)[0].contentDocument;
    $(frameDocument).find('body').prepend('<h1>TEST!!!!</h1>');
    
    0 讨论(0)
  • 2020-12-15 09:49
    var sql_mainJQ = $("frame[name='sql_main']", top.document);
    
    //$('body', sql_mainJQ.contents()).prepend("TEST!!!!"); // :( Bad
    
    var frameContent = sql_mainJQ[0].contentDocument;
    if ($.browser.msie) {
        frameContent = mainFrameJQ[0].contentWindow.document;
    } else {
        frameContent = mainFrameJQ[0].contentDocument;
    }
    $('body', sql_mainJQ.contents()).prepend("TEST!!!!"); // :> Maybe OK!
    
    0 讨论(0)
  • 2020-12-15 09:58
    <html>
    <head>
        <title>frames.html</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <frameset rows="100,*" frameborder="1" border="2">  
                    <frame src="helloworld.html" name="sq_header" id="sq_header" scrolling="yes" marginwidth="0" marginheight="0">
                       <frameset cols="380,300,*" frameborder="1" border="2" id ="main_frameset">  
                       <frame src="helloworld.html" name="sq_sidenav"  id="sq_sidenav" scrolling="yes" marginwidth="0" marginheight="0"> 
                       <frame src="anotherpage.html" name="sq_resizer" id="sq_resizer" scrolling="yes" marginwidth="0" marginheight="0">   
                       <frame src="helloworld.html" name="sq_main" id="sq_main" marginwidth="0" marginheight="0" scrolling="yes">  
                       </frameset> 
                       </frameset>
    <noframes>
    </noframes>
    </html>
    <html>
    <head>
        <title>anotherpage.html</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    
        <script type="text/javascript">
                      //http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/
                      // You may specify partial version numbers, such as "1" or "1.3",
                      //  with the same result. Doing so will automatically load the 
                      //  latest version matching that partial revision pattern 
                      //  (e.g. 1.3 would load 1.3.2 today and 1 would load 1.7.2).
                      google.load("jquery", "1.6.2");
    
                      google.setOnLoadCallback(function() {
                        // Place init code here instead of $(document).ready()
                      });
        </script>
    
        <script language="Javascript">
                    var d = new Date();
                    var n = d.getTime(); 
    
                    $(document).ready(function(){  
                       $('#title').html($("title").html());
    /*
    this is to work in safari
    see "Updated answer provided below....looks like a setTimeout maybe needed as the     frames aren't loaded when the initial startup script runs. – David Hoerster Aug 21 '10 at 16:38
    url: http://stackoverflow.com/questions/3534082/jquery-access-table-inside-a-frame
    */
    setTimeout(writemsg, 2000);
    function writemsg() {
                       $('#helloworld',top.frames["sq_main"].document).html("Write from "+ $("title").html()+" in sq_main at "+ n);
    }
                      }); 
    
        </script>
    
    </head>
    <body>
        <div id="title">
        </div>
        </p>
        <div id="helloworld">
            Hello World JQuery!</div>
    </body>
    </html>
    <html>
    <head>
        <title>helloworld.html</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    
        <script type="text/javascript">
                      //http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/
                      // You may specify partial version numbers, such as "1" or "1.3",
                      //  with the same result. Doing so will automatically load the 
                      //  latest version matching that partial revision pattern 
                      //  (e.g. 1.3 would load 1.3.2 today and 1 would load 1.7.2).
                      google.load("jquery", "1.6.2");
    
                      google.setOnLoadCallback(function() {
                        // Place init code here instead of $(document).ready()
                      });
        </script>
    
        <script language="Javascript">
                    $(document).ready(function(){  
                       $('#title').html($("title").html());
                      }); 
    
        </script>
    
    </head>
    <body>
        <div id="title">
        </div>
        </p>
        <div id="helloworld">
            Hello World JQuery!</div>
    </body>
    </html>
    
    0 讨论(0)
提交回复
热议问题