包含注册表单的Div在我单击提交后消失


Div containing a registration form disappears after I click submit.

更清楚。在我的主页这是index。php我有一个按钮叫注册,它触发一个Jquery脚本。该脚本用于在主页的顶部显示包含注册表单的div(具有display:none)。所有这些都很完美。我要做的是在用户点击提交按钮后在这个div中显示一些文本。目前,当我尝试这样做,我按下提交按钮后,div得到修改,但它消失了,我必须再次点击注册按钮看到的变化。我怎样才能阻止这一切?

有包含脚本和Register按钮的代码。

    <?php
  include 'register.php';
  include 'login.php';
  include_once 'config.php';
?>
<!DOCTYPE html>
<html lang="en">
<head>
  <link rel="StyleSheet" type="text/css" href="StyleSheet.css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  <script>
      $(document).ready(function () {
          $('#show').click(function () {
              $('#transparencyL').show();
              $('#frontlayer').show();
          });
          $('#hideL').click(function (e) {
              $('#transparencyL').hide();
              $('#frontlayer').hide();
          });
          $(document).mouseup(function (e) {
              var container = $('#frontlayer');
              var container2 = $('#transparencyL');
              if (!container.is(e.target)               // if the target of the click isn't the container...
                 && container.has(e.target).length === 0)  // ... nor a descendant of the container
              {
                  container.hide();
                  container2.hide();
              }
          });
          $('#registerB').click(function () {
              $('#transparencyR').show();
              $('#registerlayer').show();
          });
          $('#hideR').click(function (e) {
              $('#transparencyR').hide();
              $('#registerlayer').hide();
          });
          $(document).mouseup(function (e) {
              var container3 = $('#registerlayer');
              var container4 = $('#transparencyR');
              if (!container3.is(e.target)
                 && container3.has(e.target).length === 0) {
                  container3.hide();
                  container4.hide();
              }
          });
          /*
          * Replace all SVG images with inline SVG
          */
        jQuery('img.svg').each(function(){
            var $img = jQuery(this);
            var imgID = $img.attr('id');
            var imgClass = $img.attr('class');
            var imgURL = $img.attr('src');
            jQuery.get(imgURL, function(data) {
                // Get the SVG tag, ignore the rest
                var $svg = jQuery(data).find('svg');
                // Add replaced image's ID to the new SVG
                if(typeof imgID !== 'undefined') {
                    $svg = $svg.attr('id', imgID);
                }
                // Add replaced image's classes to the new SVG
                if(typeof imgClass !== 'undefined') {
                    $svg = $svg.attr('class', imgClass+' replaced-svg');
                }
                // Remove any invalid XML tags as per http://validator.w3.org
                $svg = $svg.removeAttr('xmlns:a');
                // Replace image with new SVG
                $img.replaceWith($svg);
            }, 'xml');
        });
      });
  </script>
<title>LoveFootball</title>
</head>
<body>       
<div id="topbar">
  <?php if( !(isset( $_POST['login'] ) ) ) { ?>
  <a id="show" href="#">Login</a> 
  <a id="registerB" href="#">Register</a>
  <?php 
} else {
  $usr = new Users;
  $usr->storeFormValues( $_POST );
  if( $usr->userLogin() ) {
    echo "Welcome"; 
  } else {
    echo "Incorrect Username/Password"; 
  }
}
?>

这是包含注册表单的div代码。

<?php
include_once 'config.php';
?>
<!DOCTYPE html>
<html lang="en">
 <head>
 <meta charset="utf-8" />
 <title>LoveFootball</title>
 </head>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 <script>
  $(document).ready(function () {
          $('#laba').click(function () {
              $('#transparencyR').show();
              $('#registerlayer').show();
          });
  };
  </script>
 <body>
<div id="transparencyR" style="display: none;" onclick="return false;"></div>
<div id="registerlayer" style="display: none;">
  <div id="register">
    <p>Register with us now!</p>
    <form class="registerForm" action="#" method="post">
      <table class="registerForm">
        <tr>
          <td>Email:</td>
          <td><input type="text" id="usn" maxlength="30" required autofocus name="email" size="31" /></td>
        </tr>
        <tr>
          <td>Password:</td>
          <td><input type="password" id="passwd" maxlength="30" required name="password" size="31" /></td>
        <tr>
          <td>Confirn Password:</td>
          <td><input type="password" id="conpasswd" maxlength="30" required name="conpassword" size="31" /></td>
        </tr>
        <tr>
          <td>Country:</td>
          <td><select name="country" required>
<option value="">Country...</option>
<option value="Afganistan">Afghanistan</option>
</select></td>
       </tr>
       <tr>
         <td>Date of Birth:</td>
         <td>
           <input type="date" id="conpasswd" maxlength="30" required name="birthDate" placeholder="YYYY-MM-DD" />
         </td>
       </tr>
      </table>
      <br><br><br><br><br><br><br><br><br>
      <?php if( !(isset( $_POST['register'] ) ) ) { ?>
      <input type="submit" style="float: left;" value="Register" name="register" id="laba">
      <?php 
} else {
  $usr = new Users;
  $usr->storeFormValues( $_POST );
  if( $_POST['password'] == $_POST['conpassword'] ) {
    ?> <p>Registration complete. You are awesome!</p>
    <?php 
  } else {
    ?> <p>Password and confirmed password do not match.Bro pls..</p>
    <?php
  }
}
?>
    </form>
  <input type="button" id="hideR" value="Close">
  </div>
</div>        
</body>
</html>

正如你所看到的,我试图让这个工作通过使用php代码从代码的底部,但正如我说的,当我点击提交按钮的div消失。

您是否尝试将注册按钮的输入类型更改为"button"而不是"submit" ?

试着改变这个:

      $('#laba').click(function () {
          $('#transparencyR').show();
          $('#registerlayer').show();
      });

:

      $('#laba').click(function () {
          $('#transparencyR').show();
          $('#registerlayer').show();
      });
      <?php if( (isset( $_POST['register'] ) ) ) { ?>
      jQuery('#laba').trigger('click');
      <?php } ?>