0

私のWebサイトには、ページの本文にフェードインするjQueryスクリプトがあり、ユーザーが相対リンクをクリックすると、本文がフェードアウトしてユーザーを新しいページにリダイレクトし、スクリプトが再び開始されます。

私の同僚は、ページを変更するときに全体がリフレッシュされるのを防ぐために、メインコンテンツを iframe に入れたほうがよいとアドバイスしましたが、問題は、ユーザーが相対リンクをクリックすると iframe がフェードアウトするのではなく、代わりにiframe を対象とする新しいページは、ページを開くだけです。

これを修正するにはどうすればよいですか? 行の後にエラーが発生すると思います$("body").fadeIn(2000);。

    <script type="text/javascript" src="jquery-2.0.3.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function () {
        $("body").css("display", "none");
        $("body").fadeIn(2000);
        $(".transition").click(function (event) {
            event.preventDefault();
            linkLocation = this.href;
            $("iframe").fadeOut(1000, redirectPage);
        });

        function redirectPage() {
            window.location = linkLocation;
        }
    });
    </script>

    <a href="competition.html" class="transition" target="iframe">Home</a>

    <iframe src="main.html" name="iframe" seamless="seamless" width="800" height="800">
    </iframe>
4

2 に答える 2

0

document.getElementById("iframe").srciframe の src 属性を変更し、クリックされたリンクの href に設定するために使用します。

また、使用して href を取得する必要があります$(this).attr("href");

<script type="text/javascript" src="jquery-2.0.3.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function () {
        $("body").css("display", "none");
        $("body").fadeIn(2000);
        $(".transition").click(function (event) {
            event.preventDefault();
            linkLocation = $(this).attr("href");
            $("iframe").fadeOut(1000, redirectPage(linkLocation));
        });

        function redirectPage(url) {
            document.getElementById("iframe").src = url;
        }
    });
    </script>

    <a href="competition.html" class="transition" target="iframe">Home</a>

    <iframe src="main.html" id="iframe" name="iframe" seamless="seamless" width="800" height="800">
    </iframe>
于 2013-10-24T09:57:45.260 に答える
0

多くの場合、許可されていないため、iframe ウィンドウの場所を変更することはできません。セキュリティ上の理由により、一部の Web サイトは X-Frame-Options を SAMEORIGIN に設定しています。これをテストできます。変更するだけです。

//your syntax is wrong here see below for correct

window.location = linkLocation

に

//correct way to change the location of iframe window

window.frames['yourframeName'].location=linkLocation

と<a>のリンクhref先http://www.google.com

コンソールにエラーが表示されます。

したがって、構文が間違っています。iframe の場所を変更していません。ターゲットの iframe を含むメイン ページ (ウィンドウ) の場所を変更しています。したがって、作業を完了するための修正は

function redirectPage() {
        $('iframe').attr('src',linkLocation);
        $('iframe').fadeIn()
    }
于 2013-10-24T11:00:44.397 に答える