Question

jQuery fadeIn / fadeOut函数无法正常工作

我需要创建一个注册页面;它有两个不同的div。第一个div有登录和放入的一部分注册。我没有实现电子邮件和验证的验证密码，所以每当我点击登录按钮或注册按钮;被称为first_part的div应该淡出，survey_part应该淡入。但是他的功能有时会起作用;其他时间只有页面闪烁。

HTML

<div id="first_part">
                    <div id="login_part">
                        <form>
                            <label>Kullanıcı Adı <input type="text" name="username"></label><br>
                            <label id="password_section">Şifre <input type="password" name="password"></label><br>
                            <input type="submit" value="Log In" id="login_submit">
                        </form>
                    </div>
                    <div id="register_part">
                        <span>Üyelik</span><br>
                        <form>
                        <label>Mail <input type="text"></label>
                        <input type="submit" value="Register" id="register_submit">
                        </form>
                    </div>
                </div>

                <div id="survey_part">
                    <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris aliquam at dui sed bibendum. Phasellus ultricies quam nec odio bibendum dapibus. Suspendisse varius eget metus et ultricies. Etiam fringilla, est ultrices viverra ullamcorper, tellus elit vulputate ante, ut vulputate quam metus eleifend nisi. Etiam interdum feugiat rhoncus. Nulla tincidunt, augue sed euismod ullamcorper, nisl mi luctus arcu, vel posuere nunc ipsum vel orci. Phasellus consequat augue sodales, laoreet massa in, congue massa. Ut aliquet ac lectus sed vulputate. Nunc luctus massa vel     blandit eleifend. Curabitur dictum luctus blandit.</span>
                    <form>
                        <input type="radio" name="question" value="Answer1">Answer1<br>
                        <input type="radio" name="question" value="Answer2">Answer2<br>
                        <input type="radio" name="question" value="Answer3">Answer3<br>
                        <input type="radio" name="question" value="Answer4">Answer4<br>
                        <input type="submit" value="Next">
                    </form>
                </div>

JS

$("#register_submit").on("click",function(){
        $("#first_part").fadeOut(1000,function(){
            $("#survey_part").fadeIn(1000);
        });
    });

Answer 1

尝试像这样添加e.preventDefault() -

$('#register_submit').closest('form').on('submit',function(e){
    e.preventDefault(); 
});

Answer 2

作为之前调用的fadeOut事件，表单将被提交。你应该控制提交。

jQuery fadeIn / fadeOut函数无法正常工作

jQuery fadeIn / fadeOut函数无法正常工作

2 个答案: