jQuery＆AJAX登录表格

我正在开发一个站点，我在右上角有一个登录框。我希望用户能够在不刷新的情况下登录到同一页面。jQuery＆AJAX登录表格

OK，我得到的那部分工作，但我仍然登录后过程中挣扎，我的样子如下：

（HTML）

<li class="login"> 
<? if (!isset($_SESSION['logged_in'])) { 
    include("isNotLoggedIn.php"); 
} else { 
    include("isLoggedIn.php"); 
} ?> 
</li>

（PHP）

session_start(); 

$username = $_POST['username']; 
$password = $_POST['password']; 

if ($username == "admin" && $password == "XXX") { 
    $_SESSION['logged_in'] = true; 
    $_SESSION['user'] = $username; 

    echo include("isLoggedIn.php"); 
} else { 
    echo include("isNotLoggedIn.php"); 
}

（我的jQuery）

$("form#login").submit(
    function() { 
     var usernameVal = $("input[name='username']").val(); 
     var passwordVal = $("input[name='password']").val(); 

     $.post("login.php",{username : usernameVal, password : passwordVal}, 
     // callback function to receive feedback 
     function(data) { 
      $("li.login").html(data); 
     }); 
     return false; 
    }); 

$("a[name='logout']").click(
    function() { 
     $.post("logout.php", 
      function(data) { 
       $("li.login").html(data); 
      }); 
    });

（isLoggedIn.php）

Welcome, <? echo $_SESSION['user']; ?>!<br /> 
<a href="#">Add game</a><br /> 
<a href="#">Add player</a><br /><br /> 
<a href="#" name="logout">Log out</a>

（isNotLoggedIn.php）

<form method="post" id="login"> 
    <input type="text" name="username" alt="Username" class="text" title="Username: Required" value="username" /><br /> 
    <input type="password" name="password" alt="Password" class="text" title="Password: Required" value="password" /><br /> 
    <input type="submit" name="submit" alt="Login" title="Login" value="Login" class="submit" /> 
</form>

的登录过程的工作原理，但注销是乱码。当我点击isLoggedIn.php中的Logout链接时，它会注销，但是我的文本输入的jQuery不再工作，以及表单本身的jQuery。

有没有一种方法，我必须刷新我的jQuery重新激活替换的HTML？任何帮助赞赏。

问候& TIA

来源

2009-08-13 Anriëtte Myburgh

只是为了阐述redsquare的答案，你需要你的jQuery改变这个...：

$(function() { 
    /** 
     ...What ever else you might have onload... 
    **/ 
    $("a[name='logout']").live('click',function() { // Now using the .live() event 
     $.post("logout.php", function(data) { 
      $("li.login").html(data); 
      bind_login_submit();  // <---- Notice, this is new 
     }); 
    }); 
    bind_login_submit(); // Call this function to initially bind the submit 
}); 

function bind_login_submit() { 
    $("form#login").unbind('submit').bind('submit',function() { 
     var usernameVal = $("input[name='username']").val(); 
     var passwordVal = $("input[name='password']").val(); 

     $.post("login.php",{username : usernameVal, password : passwordVal}, function(data) { 
      $("li.login").html(data); 
     }); 
     return false; 
    }); 
}

来源

2009-08-13 13:35:55 KyleFarris

我真的不使用jQuery，但我的猜测是，后并单击事件不在身边了，因为它已经通过AJAX更新。

你必须再次添加这些事件。

你可以创建一个attach（）函数来选择你想要的东西并附加事件并在你的请求的回调中运行它。

来源

2009-08-13 13:21:48

那么你正在替换的HTML，所以你会失去你先前绑定到被删除的元素的事件。在替换html内容后，您可以使用回调重新绑定事件。您也可以查看.live jQuery方法，但这不适用于提交事件，因此您必须在更改表单后重新绑定该方法。

来源

2009-08-13 13:22:26 redsquare

jQuery＆AJAX登录表格

回答

相关问题