3

ページの「right_side」divにhome.htmlページのコンテンツを表示したい。どうやってやるの？

link.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

div の代わりに、単純に iframe を使用できます。置くだけ

<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 を取得し、関連する DOM サブツリーを home.html から #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正確でなければなりません。動作するかどうかを確認してください。

loadXMLDoc()

<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 に答える