在表单验证 jquery 更新 div答案

【问题标题】：On form validation jquery updates the div在表单验证 jquery 更新 div
【发布时间】：2012-11-18 02:25:55
【问题描述】：

我正在尝试使用 jquery 进行登录。应该对文本字段进行验证以回显错误消息。如果表单已完全验证，则 jquery 中的函数应更新 div，其中有输入表单并将其更改为会话名称。但是有一个问题，当提交的表单被验证时，div 保持为空，没有会话名称。

HTML：

<html>
<head>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
jQuery(function(){
    jQuery('#form').submit(function(){
        jQuery.ajax({
            type: 'POST',
            url: jQuery('#form').attr('action'),
            data: jQuery('#form').serialize(),
                success: function(data){
                    if(data == 'success'){ 
                        jQuery('#user').load(location.href+' #user>*');
                    }else{
                        jQuery('#info').html(data);
                    }                   
                }
        });
        return false;
    });
});
</script>
</head>
<body>
<div id="user">
<div id="info"></div>
<?php
session_start();
if(isset($_SESSION['user'])){
echo $_SESSION['user'];
}else{
echo '
<form method="post" action="session.php" id="form">
<input type="text" name="user" />
<input type="submit" name="do" value="ok" />
</form>
';
}
?>
</div>
</body>
</html>

PHP：

<?php

$user = mysql_real_escape_string($_POST['user']);

if(empty($user)){
    echo 'psc';
}else{
    echo 'success';
    session_start();
        $_SESSION['user'] = $user;
}



?>

【问题讨论】：

标签： php jquery html session

【解决方案1】：

我认为你的ajax调用中的type: 'POST'通常是小写的：type: 'post'。我不确定这是否是问题所在，但您可能想尝试一下。

除此之外，您的代码的另一个问题是您没有阻止提交表单。所以基本上你正在发送一个 ajax 消息，然后立即加载一个新页面，其中包含单击提交按钮时发生的默认提交。我会认为这有加载空白页面的效果？

要解决此问题，您可以在 submit 处理程序中添加以下行：

jQuery('#form').submit(function(event){
   event.preventDefault();

请注意，我已将事件添加到处理程序参数，然后调用preventDefault() 方法来阻止表单实际提交。在处理程序中返回 false 不会为您执行此操作。

【讨论】：

hm，不适合我.. 提交后它的钢是空的 div.. 在 div 中重新加载页面后显示会话名称.. 我怎样才能在不刷新/重新加载页面的情况下完成这项工作？ ?