Question

我的表格如下。

<div id="loginerr"></div>
<form action="?page=login" method="POST" id="loginForm">
    <table width="224" cellpadding="0" cellspacing="0" border="0" align="center" style="padding-top: 45px;">
        <tr>
            <td height="26" align="center" valign="middle">
                <input tabindex="1" id="username" name="username" type="text" style="width: 157px; background-color: #e8eff7; border: 2px solid #889db0; padding: 0px; margin: 0px;"/></td>
            <td align="center" valign="middle" rowspan="2" width="57" height="52">
                    Login button --> <div id="login" class="login"></div>
            </td>
        </tr>

        <tr>
             <td height="26" align="center" valign="middle">
                <input tabindex="2" id="password" name="password" type="password" style="width: 157px; background-color: #e8eff7; border: 2px solid #889db0; padding: 0px; margin: 0px;"/>
            </td>
        </tr>

        <tr>
            <td height="40" colspan="2" align="center" valign="middle">
                <a><:FORGOT_PASSWORD:></a>
            </td>
        </tr>

        <tr>
            <td colspan="2" align="center" valign="middle">
                <a href="#!?page=register"><div class="signup"></div></a>
            </td>
        </tr>
    </table>
</form>

此脚本使用用户名和密码请求？page =登录地址，并使用返回的数据更新“loginerr”div。

<script>
$(document).ready(function(){
    $("#login").click(function(e)
    {
        e.preventDefault();  // prevent normal form submit
        $("#loginerr").html('<img src="<%THEME%>images/loading.gif">');
        var formData = $("#loginForm").serialize();
        $.post("?page=login", formData, function(data)
        {
            $("#loginerr").html(data);
        });
    });
});

我想要做的是，如果它返回成功消息（用户成功登录），它应该用account.php内容替换此表单。

我试图自己做，但失败了。

请帮忙。

Answer 1

我的解决方案是什么（不是在PHP中，但无关紧要）是我的操作返回了我通过$（'＃res'）。html（数据）或带有href属性的json更新的HTML我正在重定向。在你的情况下你可以完全相同，但如果你愿意，而不是重定向只是进行另一个AJAX调用。 'onSuccess'中的代码类似于：

if(data.href) doAjaxCall(data.href) else $('#res').html(data)

希望这会有所帮助

在你的代码中进行vizualize它会像

$(document).ready(function(){
    $("#login").click(function(e)
    {
        e.preventDefault();  // prevent normal form submit
        $("#loginerr").html('<img src="<%THEME%>images/loading.gif">');
        var formData = $("#loginForm").serialize();
        $.post("?page=login", formData, function(data)
        {
            if(data.href) doAjaxCall(data.href) else $("#loginerr").html(data) // this line changed
        });
    });
});

处理此问题的其他方法是，如果登录不起作用，则返回不同的状态，例如403，在这种情况下，您可以检查响应状态是什么，并更新#loginrr或其他内容。您还可以返回索引为“failed”和“succeeded”的json数组，并使用if（data.failed）update loginrr else if（data.succeeded）update somethingElse。有很多可能性。选择你喜欢的那个。

Answer 2

上面的account.php似乎没有任何参考？您要发布到？page = login？

使用ajax更新div，具体取决于PHP的返回值

2 个答案: