使用javascript动态显示和隐藏div

我当前的登录系统代码如下：

function handleLogin() {
    var e = $("#username").val();
    var p = $("#password").val();

    if(e != "" && p != "") {
        $.ajax({ 
            type: 'POST', 
            url: 'http://localhost/php/log.php', 
            crossDomain: true,
            data:  {username: e, password :p},
            dataType: 'json', 
            async: false,
            success: function (response) { 
                if (response.success) { 
                    alert("Your login worked");
                    $('#loginTest').html(e);
                } else {
                    alert("Your login failed");
                }
            },
            error: function(error) {
                alert('Could not connect to the database' + error);
            }
        }); 
    } else {
        alert("You must enter username and password");
    }
    return false;
}

当登录成功时，我会得到正确的警报，但是我希望登录div隐藏，并且在它下面的div显示用户名（e）

所以基本上我只需要找出如何隐藏当前div，然后显示另一个

登录div称为#loginPage，它下面的div称为#loginTest

您可以使用

hide（）

和

show（）

：

---

还有

fadeIn

，

fadeOut

，

slideUp

，

slideDown

来处理元素的显示/隐藏。您甚至可以使用

动画

来定义自己的转换。在这种情况下，始终是您的朋友。

要显示和隐藏任何特定的HTML元素，您可以使用该元素的show（）和hide（）函数。最初，您可以隐藏loginTest div，只显示loginPage div

试试这个：

function (response) { 
                if (response.success) { 
                    $(#loginPage).hide(); //Hiding login page div
                    $(#loginTest).show(); //Showing login test div
                    alert("Your login worked");
                    $('#loginTest').html(e);
                } else {
                    alert("Your login failed");
                }

---

您还可以添加显示和隐藏DIV的时间。例如

$（#loginPage）.hide（“fast”）和
$（#loginTest）.show（“slow”）。这完全取决于您需要什么。
您使用jquery Ajax，但无法获得一个简单的$（“#loginPage”）.hide（）来工作？@Fuzzyma确实如此。我猜OP最初并没有写这段代码。
function (response) { 
                if (response.success) { 
                    $(#loginPage).hide(); //Hiding login page div
                    $(#loginTest).show(); //Showing login test div
                    alert("Your login worked");
                    $('#loginTest').html(e);
                } else {
                    alert("Your login failed");
                }