0

divで動作させたいphpファイルがあります：

<?php session_start(); ?>
<?php function loginForm() { ?>
<form method="POST" action="" name="loginForm" id="loginForm" accept-charset='UTF-8'>
    <input type='hidden' name='submit' id='submit' value='1'/>
    User: <input type="text" name="user" id="user" /><br />
    Password: <input type="password" name="passwd" id="passwd" /><br />
    <input type="submit" name="login" id="login" value="Login" />
</form>
<?php } ?>

<?php function logoutForm() { ?>
    <form method="POST" action="" name="logoutForm" id="logoutForm">
        Logout: <input type="submit" value="Log out" name="logout" id="logout" />
    </form>
<?php } ?>

<?php
function loggedUser() {
    if(isset($_SESSION['user']) && isset($_SESSION['passwd'])) {
        return $_SESSION;
    } else {
        return array();
    }
}

function loginLogout() {
    $loggedUser = loggedUser();
    if(!empty($loggedUser)) {
        logoutForm();
    } else {
        loginForm();
    }
    if(isset($_POST['login']) && isset($_POST['user']) && isset($_POST['passwd']) &&
            $_POST['user'] == "admin" && $_POST['passwd'] == "admin") {
        $_SESSION['user'] = $_POST['user'];
        $_SESSION['passwd'] = $_POST['passwd'];
        header('Refresh: 1; url='.$_SERVER['REQUEST_URI']);
    }
    if(isset($_POST['logout']) && isset($_SESSION)) {
        foreach($_SESSION as $k => $v) {
            unset($_SESSION[$k]);
        }
        header('Refresh: 1; url='.$_SERVER['REQUEST_URI']);
    }
}
loginLogout();

?>

また、jqueryとhtmlにコードがあります

<script type="text/javascript">
    $(document).ready(function(){
        $('#logindiv').load('loginLogout.php');
        $('#loginForm, #logoutForm').live('submit', function(e) {
            e.preventDefault();
            $.post('loginLogout.php', $(this).serialize(), function (
                    data, textStatus) {
                $('#logindiv').html(data);
            });
            return false;
        });
    });
</script>

そしてdiv

<div id="logindiv"></div>

ページ全体を更新せずにjqueryでもログインとログアウトが機能するコードを正しく配置するにはどうすればよいですか? 行ヘッダーを認識する更新イベントとは('Refresh: 1; url='.$_SERVER['REQUEST_URI']); phpファイルで。Widhout div と jquery はうまく機能します。

ありがとうございました

4

2 に答える 2

2

ページを更新せずにログイン/ログアウト フォームを動的に更新できるようにする 2 つのファイルを使用した完全な動作例を次に示します。コードはあなたのものと非常に似ています。

form.phpのコード

<?php 
session_start(); 

function loginForm($isHidden) { 
    $display = ($isHidden) ? "none" : "block";
    ?>
    <form method="POST" action="" name="loginForm" id="loginForm" accept-charset='UTF-8' style="display: <?php echo $display; ?>;">
        <input type='hidden' name='actionLogin' id='actionLogin' value='1'/>
        User: <input type="text" name="user" id="user" /><br />
        Password: <input type="password" name="passwd" id="passwd" /><br />
        <input type="submit" name="login" id="login" value="Login" />
    </form>
    <?php 
} 

function logoutForm($isHidden) { 
    $display = ($isHidden) ? "none" : "block";
    ?>
    <form method="POST" action="" name="logoutForm" id="logoutForm" style="display: <?php echo $display; ?>;">
        <input type='hidden' name='actionLogout' id='actionLogout' value='1'/>
        Logout: <input type="submit" value="Log out" name="logout" id="logout" />
    </form>
    <?php 
}

function loggedUser() {
    if(isset($_SESSION['user']) && isset($_SESSION['passwd'])) {
        return $_SESSION;
    } else {
        return array();
    }
}
?>

<html>
<head>
    <title>Form</title>

    <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>

    <script type="text/javascript">
        $(document).ready(function(){
            $('#loginForm, #logoutForm').live('submit', function(e) {
                e.preventDefault();
                $.post('loginLogout.php', $(this).serialize(), function (data, textStatus) {
                    if (data == "true") { //login successful
                        $("#loginForm").hide();
                        $("#logoutForm").show();
                    } else {
                        $("#loginForm").show();
                        $("#logoutForm").hide();
                    }
                });
                return false;
            });
        });
    </script>
</head>
<body>

    <div id="logindiv">
        <?php
        $loggedUser = loggedUser();
        if(!empty($loggedUser)) {
            loginForm(true); //hidden
            logoutForm(false); //not hidden
        } else {
            loginForm(false);
            logoutForm(true);
        }
        ?>
    </div>

</body>
</html>

loginLogout.phpのコード

<?php
session_start(); 

if(isset($_POST['actionLogin']) && isset($_POST['user']) && isset($_POST['passwd']) &&
        $_POST['user'] == "admin" && $_POST['passwd'] == "admin") {
    $_SESSION['user'] = $_POST['user'];
    $_SESSION['passwd'] = $_POST['passwd'];
    echo "true"; //successful log in

} else if(isset($_POST['actionLogout']) && isset($_SESSION)) {
    foreach($_SESSION as $k => $v) {
        unset($_SESSION[$k]);
    }
    echo "false"; //successful log out
}
?>
于 2012-05-29T19:59:33.270 に答える
0

フォームを印刷する前にフォーム送信を処理するようにコードを変更します。直感に反するように思えるかもしれませんが、最初にすべての入力を処理しない限り、印刷した HTML は、ブラウザーに送信する準備が整った時点で既に時代遅れになっています。

ajax を使用する場合は、refresh ヘッダーも必要ありません。

次のようにコードを変更するだけです。

function loginLogout() {
    if(isset($_POST['login']) && isset($_POST['user']) && isset($_POST['passwd']) &&
            $_POST['user'] == "admin" && $_POST['passwd'] == "admin") {
        $_SESSION['user'] = $_POST['user'];
        $_SESSION['passwd'] = $_POST['passwd'];
    }
    if(isset($_POST['logout']) && isset($_SESSION)) {
        foreach($_SESSION as $k => $v) {
            unset($_SESSION[$k]);
        }
    }
    $loggedUser = loggedUser();
    if(!empty($loggedUser)) {
        logoutForm();
    } else {
        loginForm();
    }
}
于 2012-05-29T20:15:22.500 に答える