从登录转移到在 html 登录页面中注册

问题描述

我在登录页面和注册页面之间切换时遇到问题。所以我想要一段代码来帮助我从 - Register Page

到这个—— Login Page

请有人帮我处理这里的 js 部分。 （只有前端没有后端

解决方法

请检查以下代码以在登录和注册页面之间切换。

$("a").click(function(e){
        e.preventDefault();
        var x = $(this).attr("href");
        $(".form_container").removeClass("active");
        $(x).addClass('active');
    });

*{
            margin: 0;
            padding: 0;
            font-size: 16px;
        }
        .form_container{
            display: none;
        }
        .active{
            display: block;
        }
        a{
            margin: 5px 0px 0px;
            color: #000;
            display: inline-block;
            padding: 7px 10px;
            background: #ccc;
            outline: 0;
            text-decoration: none;
            border-radius: 3px; 
        }

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="container">
    <div class="form_container active" id="login">
        <h5>Login Content goes here.....</h5>
        <a href="#register">Register</a>
    </div>
    <div class="form_container" id="register">
        <h5>Register Content goes here.....</h5>
        <a href="#login">Login</a>
    </div>
</div>

,

你可以用 jquery 做这样的事情...

html

<div id="loginForm">
   LOGIN FORM
</div>

<div id="registerForm" style="display:none;">
   REGISTER FORM
</div>

<a href="#" id="toggleLogin" class="toggleRegister" >Register instead</a>
<a href="#" id="toggleRegister" class="toggleRegister" style="display:none"; >Login Instead</a>

javascript

$('document').ready( () => {

    $('.toggleRegister').on('click',(e) => { 
        e.preventDefault;
        $('#toggleRegister').toggle();
        $('#toggleLogin').toggle();
        $('#registerForm').toggle();
        $('#loginForm').toggle();
    })

});