Question

使其更清晰。在我的主页index.php上，我有一个名为Register的按钮，用于触发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消失了。

Answer 1

您是否尝试将输入类型更改为＆＃34;按钮＆＃34;而不是＆＃34;提交＆＃34;你的注册按钮？

Answer 2

尝试更改此内容：

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

到此：

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

单击提交后，包含注册表单的Div将消失。

2 个答案: