2

iFrame と、呼び出されたときにそれぞれ iFrame 内に正しく表示されるネイティブ ファイルへの 4 つのリンクを含むページがあります。私はストレートHTMLでこれを行いました。問題は、最初にページにアクセスしたときに、いずれかのリンクをクリックするまで空の iFrame が表示されることです。

到着時に最初のリンクが iFrame に取り込まれていると便利なだけでなく、実際にそれがコンテンツである場合、残りのリンクのいずれかが表示された状態でこのページに到達する方法があれば、本当におまけになります。誰かが探しに来た。たとえば、4 つのリンクのアンカーを別のページに配置した場合、誰かが 2 番目の項目を選択して、my-iFrame-page.php に到達したときに iFrame に入力されていることがわかると理想的です。

jQuery や JavaScript の使用に反対しているわけではありませんが、スクリプトの初心者にとっては、構文を理解することが重要です。誰かが私が求めていることを達成する実用的な例を投稿できれば、私は大喜びします。

4

2 に答える 2

0

src=""デフォルトページを設定するiframeの属性を設定できます。

たとえば、4つのリンクのアンカーを別のページに配置する場合、誰かが2番目のアイテムを選択し、my-iFrame-page.phpに到着したときにiFrameにデータが入力されていることを確認できれば理想的です。

言うまでもなく、iframeを含むページにリンクする前のページがある場合は、リクエストでパラメーターとして選択されたURLをiframeページに渡し、PHPを使用して属性に解析できます。

簡単にするために、sourcepage.phpとframepage.phpの2つのページがあると想像してみましょう。sourcepage.phpには、4つのラジオボタンとframepage.phpに送信する送信ボタンを備えたフォームが含まれています。ラジオボタンはすべて同じセットの一部であり、コメント「リンゴ」、「バナナ」、「チェリー」、「ピーチ」の4つの値があります。Applesラジオの値は1、Bananas2などです。各ラジオには「ページ」という名前が付いています。

これが意味するのは、フォームを送信するときに、sourcepage.phpで次のコードが必要になるということです。

<?php
    $pageIndex = $_GET["page"];
    $pageUrl = "";

    switch ($pageIndex)
    {
        case "1":
            $pageUrl = "apples.html";
            break;
        case "2":
            $pageUrl = "bananas.html";
            break;
        // And so on...
    }
?>

<!-- And then later... -->

<iframe src="<?php echo $pageUrl; ?>"></iframe>
于 2012-11-16T19:24:09.370 に答える
0

JS を使用して URL パラメーターを取得し、もちろんフッターのリンクにパラメーターを追加します。iframe に id="iframe" があると仮定すると、これでうまくいきます:)

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script>
    $(document).ready(function() {

        function get_url_param(name) {
            name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
            var regexS = "[\\?&]" + name + "=([^&#]*)";
            var regex = new RegExp(regexS);
            var results = regex.exec(window.location.href);
            if (results == null) {
                return "";
            } else {
                return results[1];
            }
        }

        if (get_url_param('show') == '') {
            $('#iframe').attr('src', 'wall-structures.php'); // Setting your default page....
        } else {
            $('#iframe').attr('src', get_url_param('show') + '.php');
        }

    });
</script>
</head>
<body>

    <a href="portfolio.php?show=wall-structures">Wall & Structures</a><br />
    <a href="portfolio.php?show=ovens-barbecues">Ovens & Barbecures</a><br />
    <a href="portfolio.php?show=pillars-arches">Pillars & Arches</a><br />
    <a href="portfolio.php?show=stairs-retaining-walls">Stairs & Retaining Walls</a><br />

    <iframe id="iframe"></iframe>

</body>
</html>

JS を使用したくない場合は、純粋な PHP でも実行できます。

<?php

    if (isset($_GET['show'])) {
        $iframe_src = $_GET['show'] . '.php';
    } else {
        $iframe_src = 'somedefaultpage.php';
    }

?>


<a href="portfolio.php?show=wall-structures">Wall & Structures</a><br />
<a href="portfolio.php?show=ovens-barbecues">Ovens & Barbecures</a><br />
<a href="portfolio.php?show=pillars-arches">Pillars & Arches</a><br />
<a href="portfolio.php?show=stairs-retaining-walls">Stairs & Retaining Walls</a><br />

<iframe src="<?php echo $iframe_src; ?>"></iframe>
于 2012-11-16T19:41:42.397 に答える