Question

我有一个类似于下面的HTML。在内容div中，我们在点击下一个时打开一个html页面targetPage.html。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<style type="text/css">
* {margin:0;padding:0}
body {
    font-family: verdana;
    font-size: 1em;
    background: #bef2a5;
}

h2 {color: white;}
#side {background: #7c8f50;}
#main {background: #426142;}
html {overflow: hidden;}
body {
    overflow: hidden;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
}
#header{
    position: absolute;
    top: 0px;    
    left: 0px;
    width:100%;
    height: 80px;
    overflow: hidden;
    background: #339933;
}
#main {
    position: absolute;    
    top: 100px;
    left: 240px;
    right: 20px;
    bottom: 20px;
    overflow: auto;
}
#side {    
    position: absolute;    
    top: 100px;
    left: 20px;
    bottom: 20px;
    width: 200px;
    overflow: auto;    
}
h2,p {padding:10px;margin:0 0 .5em 0}

iframe{
    width:100%;
    height:100%;
    position:absolute;
    left:0;
    top:0;
}

</style>
<script type="text/javascript">

function loadPageTarget(url, containerid) {
    var page_request = false;
    if (window.XMLHttpRequest)
    page_request = new XMLHttpRequest();
        else if (window.ActiveXObject) {
        try {
            page_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch(e) {
            try {
                page_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch(e) {}
        }
    } else
        return false;
        page_request.onreadystatechange = function() {
        loadpage(page_request, containerid);
        }
    page_request.open('GET', url, true)
        page_request.send(null);
    }

function loadpage(page_request, containerid) {
    if (page_request.readyState == 4 && (page_request.status == 200 || window.location.href.indexOf("http") == -1))
          document.getElementById(containerid).innerHTML = page_request.responseText;
}

</script>
</head>
<body>
<div id="header">
<input type="button" value="Next" onClick="javascript:loadPageTarget('targetPage.html','content');"/>
</div>
<div id="side">
</div>
<div id="main">
    <div class="content" id="content">
        <iframe name="myFrame" frameborder="0" src="http://www.google.com"></iframe> 
    </div>
</div>
</body>
</html>

页面targetPage如下所示

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
</HEAD>

<BODY>
<iframe id ="test" src="test.html/>" style="width: 1130px; height: 601px;" scrolling="no" frameBorder="0">
</iframe>
</BODY>
</HTML>

现在打开targetPage之后，如果我按下safari上的刷新按钮，那么该页面将返回到google.com但是在mozilla上它会回到内容中的test.html页面。任何关于如何使其工作的想法Safari？

Answer 1

这部分HTML不正确：

<iframe id ="test" src="test.html/>" style="width: 1130px; height: 601px;" scrolling="no" frameBorder="0">
</iframe>

应该是

<iframe id ="test" src="test.html" style="width: 1130px; height: 601px;" scrolling="no" frameBorder="0">
</iframe>

您的双引号出错，因此无法正确呈现

<强>更新

这是你需要改变的另一件事：

<input type="button" value="Next" onClick="javascript:loadPageTarget('targetPage.html','content');"/>

应该是：

<input type="button" value="Next" onClick="loadPageTarget('targetPage.html','content');"/>

Safari中的页面刷新问题

1 个答案: