Javascript 单击按钮时切换html登录/注册表单_Javascript_Php_Jquery_Html_Forms

Javascript 单击按钮时切换html登录/注册表单

javascript php jquery html forms

Javascript 单击按钮时切换html登录/注册表单,javascript,php,jquery,html,forms,Javascript,Php,Jquery,Html,Forms,我正在制作一个网站，要求用户登录或注册，如果他们没有帐户到目前为止，我有以下登录页面代码 <span href="#" class="button" id="toggle-login">Log in</span> <div id="login"> <h1>Log in</h1> <form> <input type="userID" placeholder="UserID" /> &l

我正在制作一个网站，要求用户登录或注册，如果他们没有帐户

到目前为止，我有以下登录页面代码

<span href="#" class="button" id="toggle-login">Log in</span>

<div id="login">
  <h1>Log in</h1>
  <form>
    <input type="userID" placeholder="UserID" />
    <input type="password" placeholder="Password" />
    <input type="submit" value="Log in" />
  </form>
</div>

我想知道是否有人可以帮我切换隐藏和取消隐藏表单，是否有一种方法可以在一个页面上有两个表单，用户可以隐藏登录表单和显示注册表单，反之亦然

我的整个页面如下所示：

    <!DOCTYPE html>
    <head>
        <title>Login Form</title> 
    </head>
    <body>
        <span href="#" class="btn btn-default" id="toggle-login">Log in</span>
        <div id="login">
            <h1>Log in</h1>
            <form>
                <input type="userID" placeholder="UserID" />
                <input type="password" placeholder="Password" />
                <input type="submit" value="Log in" />
            </form>
        </div>
        <script>
            $('#toggle-login').click(function(){
                $('#login').toggle();
            });
        </script> 
    </body>
</html>


登录表单
登录
登录
$（“#切换登录”）。单击（函数（）{
$（'#login'）.toggle（）；
});

谢谢

如果要使用jQuery库，您必须包含它。把这个加到你的头部，你会没事的

<script type="text/javascript" src="//code.jquery.com/jquery-2.1.3.min.js"></script>

在head会话中还包括jquery库

<script type="text/javascript" src="//code.jquery.com/jquery-2.1.3.min.js"></script>

你的代码确实工作得很好-当我把它放在记事本++中时，它似乎不工作，除非我没有将javascript文件与html文件正确链接。也许页面中的其余代码，我们可能会找到另一个导致你的问题的错误，与此代码段无关。请尝试

console.log（）

中的

。单击

功能。也许jQuery没有加载，或者JS文件没有加载到它应该加载的位置？我编辑了我的原始帖子，以显示我在登录页面上使用的整个html代码有没有办法在表单之间切换？例如，我在一页上有两张表格。我希望能够隐藏一个窗体并显示另一个窗体。是的，只需向单击函数添加另一行，如$（“”）。toggle（）；

<div id="toggle-login">
<form>
<!-- FORM ELEMTNS -->
<input typre="text">
</form>    
</div>
<input type="button" id="btn" value="toggle login" >

$("#btn").click(function(){
$("#toggle-login").toggle();
});

<script type="text/javascript" src="//code.jquery.com/jquery-2.1.3.min.js"></script>