2013-09-12 4 views
0

У меня есть 3 html-страницы. main.html, page1.html и page2.html. Я показываю page1.html и page2.html в main.html, используя следующий код.top.frames wont work in chrome

<!DOCTYPE html> 
<html> 
    <frameset frameborder="1" rows="50%, *"> 
     <frame name="f1" src="Page1.html" /> 
     <frame name="f2" src="Page2.html"/> 
    </frameset> 
</html> 

page1.html код

<!DOCTYPE html> 
<html> 
    <head> 
     <style> 
      .content {display:none;} 
     </style> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
     <script src="myjs.js"></script> 
    </head> 
    <body> 
     <table id="resultDetails" border="1"> 
       <th>Result Details</th> 
       <tr> 
        <td> 
        Click on me to see more details in other page 
        <div class="content"> 
         <p> R1 data</p> 
        </div> 
        </td> 

       </tr> 
     </table> 
    </body> 
</html> 

И Page2.html код

<!DOCTYPE html> 
<html> 
    <body> 
     <div id="myDiv"> 

     </div> 

     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
     <script src="myjs.js"></script> 
    </body> 
</html> 

Мои JavaScript myjs.js

$(document).ready(function() { 
    $('table').on('click', 'tr', function() { 
     var doc =window.top.frames['f2'].document; 
     var divElmnt = $(doc.getElementById('myDiv')); 

     $(divElmnt.html($(this).find('.content').html())); 
    }); 
}); 

С помощью этого кода, при нажатии на таблицу строка, я могу отображать div "content" содержание в разделе «mydiv» на странице 2.

Это работает в IE и FF, но не работает в Chrome. Ошибка: doc не определен. Что эквивалентно для window.top.frames ['f2'] для хром.

ответ

0

Проблема была с флагом безопасности Chrome для локальных файлов, то есть файла: ///. После запуска Chrome с опцией «--allow-file-access-from-files» работало top.frames.

Также я нашел полезный документ по межкадровой связи с JavaScript here.

0

Дайте FRAMESET и фоторамке идентификатор:

var $fs = $("#fs"); 
var f2 = $fs.find("#f2"); 

f2 теперь объект JQuery.

+0

Я пробовал это, но безуспешно. 'var $ fs = $ (" # fs "); var doc = $ fs.find ("# f2"); var elmnt = doc.document; 'Ошибка: doc не определен. Я что-то упустил? – MIM