Question

所以我有登录页面，如果他们点击按钮进行注册，我会尝试用注册表单替换登录表单。

目前我有：

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("w").replaceWith(function(n){
            return "DIV HERE BUT DIVS DO NOT WORK";
        });
    });
});
</script>
</head>
<body>
<div class="col-lg-6 col-sm-6 col-xs-12 social-login">
                        <a href="#" class="google_button login_btn">
                            <i aria-hidden="true" class="fa fa-google-plus-square"></i><span>Continue with Google</span>
                        </a>
                        <a href="#" class="facebook_button login_btn">
                            <i aria-hidden="true" class="fa fa-facebook-square"></i><span>Continue with Facebook</span>
                        </a>
                        <a href="#" class="twitter_button login_btn">
                            <i aria-hidden="true" class="fa fa-twitter-square"></i><span>Continue with Twitter</span>
                        </a>
                        <a href="#" class="linkedin_button login_btn">
                            <i aria-hidden="true" class="fa fa-linkedin-square"></i><span>Continue with Linkedin</span>
                        </a>
                        <a href="/signup" class="email_button login_btn">
                            <i aria-hidden="true" class="fa fa-linkedin-square"></i><span>Continue with Email</span>
                    </a>
                    <button>Continue With Email</button> <span class="light_grey">By signing up you indicate that you have read and agree to the <a target="_blank" href="#">Terms of Service</a> and <a target="_blank" href="#">Privacy Policy</a>.</span>
                </div>

                    <form action="" class="signin_form" method="post">
                        <w><div class="title">Login</div></p></w>
                        <div class="form_inputs">
                            <div class="form_column">
                                <input type="text" name="username" id="username" placeholder="Email" value="" class="username">
                            </div>
                            <div class="form_column">
                                <input type="password" name="password" id="password" placeholder="Password" value="" class="password">
                            </div>
                            <div class="form_column">
                                <span><div class="remember_checkbox"><input type="checkbox" value="" name="remember_checkbox" checked="checked" class="remember_checkbox">Remember Me</div></span><input type="submit" value="Sign In" name="send" class="btn btn-primary pull-right" />
                                <span><a href="#" class="forgot_password">Forgot Password?</a></span>
                            </div>
                        </div>
                    </form>
</body>

我想将表格类signin_form替换为：

                        <form action="" class="signup_form" method="post">
                        <div class="title">Sign up!</div>
                        <div class="form_inputs">
                            <div class="form_column">
                                <input type="text" name="email" id="email" value="<?php echo $dd; ?>" class="email" placeholder="Email">

                            </div>

                            <div class="form_column">
                                <input type="text" name="username" id="username" placeholder="First Name" value="<?php echo $_POST['username']; ?>">
                            </div>

                            <div class="form_column">
                                <input type="password" name="password" id="password" placeholder="Password" value="" class="password">

                            <div class="form_column">
                                <input type="password" id="confirm_password" name="confirm_password" placeholder="Confirm Password" value="" class="confirm_password">
                            </div>

                            <div class="form_column">
                                <span><a href="/login" class="forgot_password">Already Have an Account?</a></span><input type="submit" value="Sign Up" name="send" class="btn btn-primary pull-right" />
                            </div>
                        </div>
                    </form>

使用我当前使用的replaceWith，如果我没有包含div，可以替换一行，如果我放入div，它就不会再加载。

Answer 1

我认为replaceWith不是实现所需功能的正确方法，这不是因为你不能，因为你需要动态创建一个新表单并且必须将所有事件挂钩到元素中新形式。相反，你应该做以下

同时创建登录和注册表单
隐藏CSS中的注册表单并仅显示登录表单
点击按钮隐藏登录表单并显示注册表单。

这将是实现您所追求的功能的最简单，最安全的方式。

JQuery Replacewith DIV无法加载

1 个答案: