隐藏登录表单与Jquery

Question

我创建登录时，点击提交按钮发送变量login_success.php page.but我想使当我点击提交按钮登录表单将关闭。我可以使用jquery关闭表格

<script type="text/javascript"> 
$(document).ready(function(){ 
$("button").click(function(){ 
    $(".loginform").hide(); 
}); 
}); 
</script> 

但是这个时候表单不发送请求到.php文件。我将它制作成.php文件的插件脚本，然后重定向到index.html site.It也很好，但是我可以看到反射。如何将它们合并？

这是我的形式

<div class="loginform"> 
    <form action="php/login.php" method="post" id="login"> 

     <fieldset class="loginfield"> 
        <div> 
      <label for="username">User Name</label> <input type="text" id="username" name="username"> 
     </div> 
     <div> 
      <label for="password">Password</label> <input type="password" id="password" name="password"> 
     </div> 
    </fieldset> 
     <button type="submit" id="submit-go" ></button> 
    </form> 
</div> 

编辑 我使用的功能函数naveed伤心。我在Firefox安装萤火，我可以看到我的表单验证工作normal.It发送和请求的login.php但我无法对我的表格做任何更改。它不会关闭或$ div值不显示在div标签上。

Answer 1

您应该使用JSON/AJAX组合：

Downlod jQuery

如果您的形式是这样的：

<script type="text/javascript" src="jquery-1.4.2.js"></script> 
<script type="text/javascript" src="ajax.js"></script> 

<div id='errors'></div> 
<div class='loginform' id='loginform'> 
    <form action="php/login.php" method="post" id="login"> 
    Username:<input type="text" id="username" name="username"> 
    Password:<input type="password" id="password" name="password"> 
    <button type="submit" id="submit-go" value='Login'></button> 
    </form> 
</div> 

jQuery代码在ajax.js文件提交表单，然后从'php/login.php'在JSON并填写所需的DIV。如果登录是窗体的ID。

jQuery('#login').live('submit',function(event) { 
    $.ajax({ 
     url: 'php/login.php', 
     type: 'POST', 
     dataType: 'json', 
     data: $('#login').serialize(), 
     success: function(data) { 
      for(var id in data) { 
       jQuery('#' + id).html(data[id]); 
      } 
     } 
    }); 
    return false; 
}); 

你的login.php在形式上action属性描述文件：

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

if($username and $password found in database) { 

    // It will replace only id='loginform' DIV content 
    // and login form will disappear 
    $arr = array ("loginform" => "you are logged in"); 

} else { 

    // It will replace only id='errors' DIV content 
    $arr = array ("errors" => "You are not authenticated. Please try again"); 

} 
echo json_encode($arr); 

更多详细信息：

• How to submit a form in ajax/json：
• General jquery function for all forms

Answer 2

尝试submit method

$("button").click(function(){ 
    $("form.loginform").submit().hide(); 
}); 

PS你知道，在页面上应用onclick处理所有<button>元素是坏主意，对吧？

Answer 3

$(document).ready(function(){ 
    $("button").click(function(){ 
     $(".loginform").hide(); 
      return false; 
    }); 
});