2

この関数を使用して、div 要素内にページのコンテンツをロードしたい:

function loadmypage(DIV, pageURL)
{
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(DIV).innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET", pageURL ,true);
xmlhttp.send();
}

ただし、「フレーム」自体の内部のリンクをクリックすると、機能が機能しません。ターゲット要素がロードされたページ自体とは異なるページにある理由を推測します。

私の質問は次のとおりです。フレーム自体の中にページ全体をロードする際に、div要素をiframeのように動作させる方法はありますか?

PS: セキュリティ上の理由から iFrame を使用することも、効率上の理由から jQuery を使用することも許可されていません。メインページのリンクはターゲットを正常にロードしますが、これらのページ内のリンクをクリックすると問題が発生します。

 <div id="nav" class="mmenu">
                                <ul type="none">

                                            <li><a  href= "javascript:loadmypage('viewMessages.php')">Messages</a></li>
                                            <li><a  href= "javascript:loadmypage('userHomepage.php')">My Conferences</a></li>
                                            <li><a  href= "javascript:loadmypage('availableConferences.php')">Conferences</a></li>
                                            <li><a  href= "javascript:loadmypage('incomingRequests.php')">Requests</a></li>
                                            <li><a  href= #>News</a></li>
                                            <li><a  href= #>Options</a></li>


                                        </ul>
                                    </div>
                            </fieldset>

                                        <div id="collabsoft" class="collabsoft">
4

2 に答える 2

3

div 引数がないため、リンクが機能しません。あなたの機能に注意してください：

function loadmypage(DIV, pageURL)
{
...

最初の引数は DIV で、pageURL のみを渡しています。

<li><a  href= "javascript:loadmypage('viewMessages.php')">Messages</a></li>
                                            <li><a  href= "javascript:loadmypage('userHomepage.php')">My Conferences</a></li>
                                            <li><a  href= "javascript:loadmypage('availableConferences.php')">Conferences</a></li>
                                            <li><a  href= "javascript:loadmypage('incomingRequests.php')">Requests</a></li>
于 2012-05-09T21:08:03.187 に答える
0

<div><iframe>そのようなものを想像すると、設定やトグルでそのように動作させることはできません。結局のところ、必要に応じ<iframe>て を使用する必要があります<iframe>。

とにかく、機能しないリンクはおそらく相対アドレス指定を使用しています。これは、ページ上の内部リンクに対する妥当な期待です。それらがページから機能するには、絶対アドレスを使用する必要があります。

したがって、ページをロードした場合

www.example.com/somedirectory/index.php

そしてそれは使用した

<link href="style.css" >

使用する必要があります

<link href="www.example.com/somedirectory/style.css" >

等

linkしたがって、DOM ツリーをトラバースして、 、a、およびその他のすべての要素を探して、img属性のアドレスを使用し、それらの属性をチェックし、それらが絶対アドレスを使用しているかどうかをチェックできます (正規表現で実行できますが、私はあなたにそれを与えたくありません)現在、多くの可能性があるため: http://something...、www.something.com/...またはlocalhost/...)、そうでない場合は、それらを絶対的に参照します (ダウンロードしたドキュメントが配置されている Web ページとディレクトリへのパス全体を前に追加することにより)。

再帰関数を使用して DOM ツリーをトラバースできます。訪問することから始めて、訪問document.bodyしたすべてのノードに対して、すべての要素の子に対して関数を呼び出します。あなたの場合は、document.getElementsByTagName必要な特定の要素のリストを正確に取得するために利用できます。

最後に、セキュリティ上の理由により、スクリプトは同じホスト (IP およびポート) から含める必要があることに注意してください。したがって、他の Web からのスクリプトは、リモートで参照されている場合には機能しません。それらもサーバーにダウンロードする必要があります。

TLDR: jQuery は必要ありませんが、<iframe>.

于 2012-05-09T21:18:06.350 に答える