两个登录/注册按钮是相同的.如何为同一个按钮提供 2 个功能

Both login/signup button are the same. How do i Give 2 functionalities to the same button.?

本文关键字：按钮 同一个 功能 两个 登录 注册      更新时间：2023-09-26

我的英语不是很好，所以请原谅我。我的网站上有这个登录/注册表格。但是，两个登录/注册按钮是相同的，只是文本通过点击更改。我可以注册一个用户，然后在数据库中提交信息。虽然，我似乎无法登录用户。我不知道如何将我的登录作为按钮并提交，以便检查数据库中的用户。如何命名我的按钮提交和登录？

用户尝试登录/注册的页面：

        <?php
    session_start();
    if(isset($_POST['login'])) {
        include_once("php/config/database.php");
        $Email = strip_tags($_POST['Email']);
        $Password = strip_tags($_POST['Password']);
        $Email = stripslashes($Email);
        $Password = stripslashes($Password);
        $Email = mysqli_real_escape_string($db, $Email);
        $Password = mysqli_real_escape_string($db, $Password);
        $Password = md5($Password);
        $sql = "SELECT * FROM Users WHERE Email='$Email' LIMIT 1";
        $query = mysqli_query($db, $sql);
        $row = mysqli_fetch_array($query);
        $id = $row['UserID'];
        $db_Password = $row['Password'];
        if($Password == $db_Password) {
            $_SESSION['Email'] = $Email;
            $_SESSION['UserID'] = $id;
            header("Location: account.php");
        } else {
            echo "You didn't enter the correct details!";
        }
    } ?>

<!DOCTYPE html>
<html >   <head>
    <meta charset="UTF-8">
    <title>background</title>


        <link rel="stylesheet" href="css/style.css">  <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
     <script src="js/index.js"></script>
    </head>
  <body>

    <div class="container demo-1">


      <div class="content">
        <div id="large-header" class="large-header">
      <form  action="signup_destination.php" method="POST" />  
          <div class="box">

      <h1 id="logintoregister">Login</h1>

  <div class="group show">      
      <input class="inputMaterial" type="text" name="FirstName" required>
      <span class="highlight"></span>
      <span class="bar"></span>
      <label>First Name</label>
      </div>
    <div class="group show">      
      <input class="inputMaterial" type="text" name="Surname" required>
      <span class="highlight"></span>
      <span class="bar"></span>
      <label>Surname</label>
      </div>

     <div class="group ">      
      <input class="inputMaterial" type="email" name="Email" required>
      <span class="highlight"></span>
      <span class="bar"></span>
      <label>Email</label>
      </div>
    <div class="group">      
      <input class="inputMaterial" type="password" id="password" name="Password" required>
      <span class="highlight"></span>
      <span class="bar"></span>
      <label>Password</label>
      </div>
    <div class="group show">      
      <input class="inputMaterial" type="password"  id="confirm_password" required>
      <span class="highlight"></span>
      <span class="bar"></span>
      <label>Confirm Password</label>
      </div>

    <button id="buttonlogintoregister"  type = "submit" name="submit">Login</button>
      <p id="plogintoregister">By registering, You accept all terms and conditons </p>
      <p id="textchange" onclick="register()"> Sign Up</p>

             </form> 
      <!-- Related demos -->
      <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
     <script src="js/index.js"></script>

</body> </html>

Javascript:

var cont = 0;
function register(){
     cont++;
                if(cont==1){
            $('.box').animate({height:'600px'}, 550); 
            $('.show').css('display','block');          
            $('#logintoregister').text('Register');             
            $('#buttonlogintoregister').text('Register');           
            $('#plogintoregister').text("Sei gia' registrato?");            
            $('#textchange').text('Login');         }       else                        {           
            $('.show').css('display','none');           
            $('.box').animate({height:'365px'}, 550);           
            $('#logintoregister').text('Login');                            
            $('#buttonlogintoregister').text('Login');          
            $('#plogintoregister').text("Non sei iscritto?");           
            $('#textchange').text('Register');          cont = 0;                       } }
var password = document.getElementById("password")   , confirm_password = document.getElementById("confirm_password");
function validatePassword(){   if(password.value != confirm_password.value) {
    confirm_password.setCustomValidity("Passwords Don't Match");   } else {
    confirm_password.setCustomValidity('');   } }
password.onchange = validatePassword; confirm_password.onkeyup = validatePassword;

当用户离开电子邮件的输入字段时，您可以针对数据库发送 AJAX 请求，检查电子邮件是否存在。

如果不存在，您可以将"登录"文本替换为"注册"。

给您的电子邮件输入一个 id="email"，然后

$( "#email" ).blur(function() {
    $.ajax({
        url: // Add script that checks for existing email, should return count
    })
    .done(function( data ) {
        if (returned count = 0) {
            $("#buttonlogintoregister").html("Sign up");
        }
    });
});
相关文章：