3

我想在页面的“right_side” div 中显示 home.html 页面的内容。我怎样才能做到这一点？

链接.html-----------

<html>
<head>
<title>Link Example</title>
</head>
<body>
<div id="left_side">
<a href="home.html" >Home</a>
<a href="products.html" >Home</a>
</div>
<div id="right_side">
</div>                                    
</body>
</html>
4

3 回答 3

4

你可以简单地使用 iframe 而不是 div。就放

<iframe name="right_side" src="" width="100%"  
        height="100%" frameBorder="0"></iframe>

代替您的右侧 div。

并替换<a href="somelink">为<a href="somelink" target="right_side">

于 2012-08-26T09:51:40.357 回答
2

假设您想要一个动态解决方案：您可以使用 jQuery 之类的东西来检索 home.html 文件的 HTML/DOM，然后将 home.html 中的相关 DOM 子树插入 #right_side div。

否则（非动态）：只需复制并粘贴内容。但这太微不足道了，我想。

于 2012-08-26T09:46:10.257 回答
2

改用 Ajax。写这样的东西

 <a href="javascript: loadXMLDoc();" >Home</a

并在您的head实施中。我添加了一个 javascript google jquery 位置。你的css中必须有那个“right_side”div。文件的位置home.html必须准确。检查它是否有效。

加载XMLDoc()

<html>
<head><script type="text/javascript" src="[http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js]"></script>
<title>Link Example</title>
<script type="text/javascript">
    function loadXMLDoc() {
        var xmlhttp;
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function() {
            if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                document.getElementById("right_side").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("POST","home.html",true);
    xmlhttp.send();
}
</script></head>
<body>
    <div id="left_side">
        <a href="javascript:loadXMLDoc()" >Home</a>
        <a href="products.html" >Home</a>
    </div>
    <div id="right_side">
    </div>                                    
</body>
</html>
于 2012-08-26T09:57:26.700 回答