Может ли дочернее событие iframe onload инициировать обновление URL-адреса в родительском окне и при этом сохранить функциональность кнопки возврата в браузерах? - PullRequest
5 голосов
/ 22 октября 2009

Вопрос касается функциональности iframes / bookmarkablity и кнопки возврата.

Эта проблема, с которой я сталкиваюсь, заключается в том, как создавать iframes с закладками URL, не теряя функциональность кнопки «назад». Допускает, что все страницы находятся в одном домене, а дочерние страницы информируют родителя о загрузке дочерней страницы для обновления window.location Свойство .hash для изменения текущей адресной строки браузера.
Обновление URL отлично работает на IE / FF / webkit. Но кнопка «Назад» работает, как и ожидалось, в IE-8, а кнопка «Назад» в браузере не работает в FF / webkit (только изменение URL-адреса предыдущей страницы не загружается). Если мы не обновляем свойство window.location.hash, кнопка «Назад» работает, но URL окна не имеет смысла.
Есть ли способ получить эту функциональность через браузеры, или есть более простой способ сделать это (любой другой js libs). Все страницы обслуживаются с одного сервера, чтобы обойти проблему с разрешениями.

Следующие файлы

  • index_parent.html (содержит фреймы)
  • son.html
  • grandson.html

Сын и внук связаны между собой, и любая навигация между сыном и внуком в родительском iframe обновляет адресную строку, но при нажатии кнопки «Назад» в FF.

cat index_parent.html

<html>    
<head>   
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
 <title>Parent</title>    
    <style>   
        body{   
            margin:0;   
            overflow: hidden;     
        }    
        iframe {   
     border: 1;    
            height: 100%;   
            width: 100%;   
            overflow-x: hidden;   
        }   
    </style>     

      <script language="javascript">    
        function update(url,title){     
        alert("parent_update")    
        document.title=title;    
        window.location.hash ="#" + url; // comment this to get the back button working   
                    //in FF/webkit --but makes the url  non bookmarkable     
         }    
        function parent_loader(){   
        alert("parent_loader")    
        if (window.location.hash.substr(1)) {   
            document.getElementById("embedframe").src=window.location.hash.substr(1);    
        } else {    
            document.getElementById("embedframe").src="son.html";    
        }    
         }    
    </script>   

</head>   
<body onLoad="parent_loader()" >   
<H1> Parent</H1>    
    <iframe name="embedframe" id="embedframe" src="" frameborder="1" ></iframe>   
</body>   
</html>   

cat son.html

<html>   
<title> son </title>   

<script language="JavaScript">   
function son_loader() {     
    alert("son_loader");    
    if (self.location.href!=top.location.href) {    
          parent.update(location.href, document.title);  
    }   
};   
</script>

<body onload="son_loader()" >  
<H1> son </H1>  
<a href="grandson.html">Grandson <   /a>    
</body>   
</html>

cat grandson.html

<html>   
<title> grandson </title>  

<script language="JavaScript">  
function grandson_loader() {    
    alert("grandson_loader");   
    if (self.location.href!=top.location.href) {    
        parent.update(location.href, document.title);    
    }  
}    

</script>    

<body onload="grandson_loader()" >  

<H1> Grandson </H1>    
<a href="son.html">Father </a>    
</body>   
</html>

1 Ответ

0 голосов
/ 09 июля 2013

Вы можете установить назначение кнопки «Назад» в функции загрузчика явно, используя history.pushState, как описано здесь:

https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Manipulating_the_browser_history

...