0

好的，所以我使用 HTML、jQuery 的 $.post() 和 PHP 编写了一个注册和登录。

唯一的问题是在第二个选项卡（注册）并提交表单时，它会返回到第一个选项卡（登录）。我希望它只是在同一个选项卡中回显错误/成功消息而不带我回来。

登记表：

报名表提交后：

再次单击注册选项卡：

如您所见，它会输出错误，但不会将我返回到正确的选项卡，尽管它仍然显示“注册”选项卡处于活动状态。

PHP：

<?php
include_once('../php/db.php');
echo '
<link rel="stylesheet" href="./css/styles.css" type="text/css" />
<script src="./plugins/loader.js" type="text/javascript"></script>
';

    $values = array(

        'email'             => @$_POST['email'],
        'password'          => sha1(@$_POST['password']),
        'confirm_password'  => sha1(@$_POST['confirm_password']),
        'register_ip'       => $_SERVER['REMOTE_ADDR'],
        'register_date'     => date("F j, Y"),
        'login_date'        => 'N/A',
        'user_rights'       => 0,
        'last_ip'           => $_SERVER['REMOTE_ADDR'],

    );

        if($values['password'] == $values['confirm_password']
        && filter_var($values['email'], FILTER_VALIDATE_EMAIL)) {
        echo '<p class="message valid">You have been successfully registered.  Click "Log-In."<span class="close">X</span></p>';

        $insertUser = $db->prepare("INSERT INTO `users`
                                  (`email`, `register_ip`, `register_date`, `login_date`, `password`, `user_rights`, `last_ip`)
                                  VALUES (:email, :register_ip, :register_date, :login_date, :password, :user_rights, :last_ip)");
        $insertUser->execute(array(

            ':email'            => $values['email'], 
            ':register_ip'      => $values['register_ip'],
            ':register_date'    => $values['register_date'],
            ':login_date'       => $values['login_date'],
            ':password'         => $values['password'],
            ':user_rights'      => $values['user_rights'],
            ':last_ip'          => $values['last_ip'],

        ));
        }
        else {
        echo '<p class="message invalid">There was an error with your registration.<span class="close">X</span></p>';
        }
?>

HTML：

<ul class="navigation clearfix">
      <li> <a class="current" href="#tab1">Log-In</a></li>
      <li><a href="#tab2">Register</a></li>
      <li><a href="#tab3">Recover Password</a></li>
     </ul>
     <!--tab1-->
     <div class="tab" id="tab1">
      <form action="./php/login_process.php" method="POST" class="form loginForm">
        <span class="loginResult"></span>
       <p class="field">
      <label>E-mail Address </label>
      <input class="large" name="email" type="text">
     </p>
     <p class="field">
      <label for="username">Password  </label>
      <input id="username" name="password" class="large" type="password">
     </p>
     <p class="field">
        <button class="logBtn">Log-In</button>
        <button type="reset" class="secondary">Reset</button>
     </p>
   </form>
     </div>
     <!--tab2-->
     <div class="tab" id="tab2">
        <form action="./php/register_process.php#tab2" method="POST" class="form registerForm">
        <span class="registerResult"></span>
     <p class="field">
      <label for="username">E-mail Address </label>
      <input id="username" name="email" class="large">
     </p>
     <p class="field">
      <label for="username">Password </label>
      <input name="password" type="password" class="large" id="email">
    </p>
         <p class="field">
      <label for="username">Repeat Password </label>
      <input name="confirm_password" name="confirm_password" class="large" id="email" type="password">
    </p>
     <p class="field">
      <button type="submit" class="registerBtn">Register</button>
      <button type="reset" class="secondary">Reset</button>
     </p>
    </form>

jQuery：

<script type="text/javascript">

$(".registerBtn").click( function() {
 $.post( $(".registerForm").attr("action"), 
         $(".registerForm :input").serializeArray(), 
         function(info){ $(".registerResult").html(info); 
   });
});

$(".registerForm").submit( function() {
  return false; 
});

</script>
4

1 回答 1

0

尝试这个：

<script type="text/javascript">

$(".registerBtn").click( function() {
	
	$('.navigation > li').removeClass('current');		
	$('a[href="#tab2"]').addClass('current');
	
 	$.post( $(".registerForm").attr("action"), 
         $(".registerForm :input").serializeArray(), 
         function(info){ $(".registerResult").html(info); 
   });

});

$(".registerForm").submit( function() {
  return false; 
});

</script>

于 2016-01-12T06:41:36.983 回答