4

私はしばらく頭を悩ませてきたので、できるだけ簡単にします。Aページのフォーム送信で、Cページのdiv内にBページのコンテンツをロードしたいと思います。例：

login.html

<form id="test" action="#" method="post">
  <input type="text" name="user"/>
  <input type="submit" name="login" value="login"/>
</form>

user.php

<?php
  echo "Hello, ".$_POST['user'];
?>

index.html

<body>
 <div id="target"></div>
</body>

最終結果（index.html）

「こんにちは、JohnDoe」

URLを最初のセレクターとしてload（）メソッドを使用しますか？

$('#test').submit(function() {
 $('index.html#target').load('user.php');
});

PS：すべてのページが同じドメインにあります。

PPS：別のページからではなく、別のページの内側で言いました。

4

4 に答える 4

1

これは変更が必要なようです

$('index.html#target').load('user.php');

に

$('#target').load('user.php');

編集: わかりました、いくつかの非常に基本的なマークアップを使用して、うまくいけば便利なコードを追加します。これはあなたのコードに固有のものではありませんが、概念は有用であり、2、3 の html ページだけでテスト可能であり、派手なものは何もありません。

ここで説明するのは、あるページから、別のページからスクリプトを呼び出す方法です。メイン ページと呼ぶ 1 つのページ/ウィンドウと、子ページと呼ばれる別のページ/ウィンドウを作成します。これはどれも非常に凝ったマークアップではありません。

それらは、いくつかの非常に基本的なスクリプト呼び出しを使用して対話し、相互に情報をやり取りします。最初にそれぞれのマークアップを示し、次にそれぞれのスクリプトを示します。各ページのヘッダーには jQuery がリンクされています。

ここでの私の主なポイントは、各ページへの参照を取得する限り、これの修正バージョンを使用して、別のページからインスタンス化されたスクリプト/アクションを使用して何かを実行するように 1 つのページに指示できるということです。私の例では、この参照用に window open と window.opener を使用しています。

メイン ページのマークアップ: ページは「TestCallbackmain.html」です。

<body>
    <div class='pagetop'>
        Test Callback Main
    </div>
    <div class='pageDetailContainer'>
        <div class='pageDetail'>
            Move on folks, nothing to see here
            <div id='detailContent'>
            </div>
            <button id='closeChildy'>
                Close Childy Window</button>
            <button id='openChildy'>
                Open Childy Window</button>
            <div id='childSees'>
                me empty</div>
        </div>
    </div>
</body>

子ページのマークアップ: これは「TestCallBack.html」と呼ばれます

<body>
    <div class='pagetop'>
        Test Callback Child
    </div>
    <div class='pageDetailContainer'>
        <div class='pageDetail'>
            <div id="achildy">
                HereIBe
                <div id="inchildy">
                    I am childy text
                </div>
            </div>
            <button id='pleaseKillMe'>
                Have Parent Close Me</button>
            <div id='textHolder'>
            </div>
            <div id='callbackTextHold'>
            </div>
        </div>
    </div>
    Howdy
</body>

メインページのスクリプト:

function logNewWindow(newWindow, JQnewWindowDoc) {
    var mychildText = JQnewWindowDoc.text(); //all the child doc text
    var innerChildText = $("#inchildy", JQnewWindowDoc).text(); // one element text
    var gotback = newWindow.childCallBack("CHILD TEXT:" + mychildText + " INNER:" + innerChildText);
    $('#callbackTextHold').text("GOT:" + gotback); //child sent me this text from childCallBack
};

var AWindow;
function openChild() {
    AWindow = window.open("TestCallBack.html");
};
$(document).ready(function() {
    $('#detailContent').text('Loaded JQ');
    $('#closeChildy').click(function() {
        AWindow.close();
    });
    $('#openChildy').click(function(e) {
        openChild();
        e.stopImmediatePropagation();
    });
});

子ページのスクリプト:

var ct;
function childCallBack(passstuff) {
    $('#textHolder').html('ct:"' + ct + '"<br /> CHILD GOT:(' + passstuff + ")");
    return ct;
};

$(document).ready(function() {
    ct = $("#achildy").text();
    window.opener.logNewWindow(window, $(document));

    $('#childSees', window.opener.document).text('You been Had by child');

    $('#pleaseKillMe').click(function() {
        $('#closeChildy', window.opener.document).click();
    });
});
于 2012-08-08T14:10:33.097 に答える
1

$('index.html#target').load('user.php')に変更$('#target').load('user.php');

targetidからdiv を取得する場合は、次のuser.phpコードを使用します。

$('#target').load('user.php #targer');

しかし、おそらく投稿リクエストを送信したいですか?

$.post('user.php', $('form').serialize(), function(data){
    $("#target").html(data)
});​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

学ぶべきこと:

于 2012-08-08T14:13:05.170 に答える
0

user.php

<?php 
    session_start();
    if($_POST && $_POST['user']):
      if(!isset($_SESSION['user'])):
        $_SESSION['user'] = $_POST['user'];
        echo $_SESSION['user'];
      endif;
    elseif(isset($_SESSION['user'])):
      echo $_SESSION['user'];
    else:
      echo 'How did you get to this page?';
    endif;
?>

期待どおりにファイルをロードします。ファイルに投稿されたフォーム データがある場合は、それを返します。フォーム データがないが、フォームが以前に送信された場合、セッションはそれをキャッチしてユーザー名を出力します。フォームを送信せずにページを要求した場合、「このページにどのようにアクセスしましたか?」というメッセージが表示されます。

于 2012-08-08T14:05:44.580 に答える
0

おそらく、サーバー側で行うのが最善でしょう。

index.html (index.php である必要があります) では、次のようにします。

<body>
    <div id="target">
         <?php include 'user.php';
    ?></div>
</body>

login.html では、フォームは次のように設定する必要があります。

<form id="test" action="index.php" method="post">

js や jQuery は必要ないことに注意してください。

于 2012-08-08T14:04:40.100 に答える