Javascript无法正常工作 [英] Javascript is not working

问题描述

 $（function（）{
 
 $（'＃login-form-link'）。click（function（e）{
 debugger; 
 $（＃login-form）。延迟（100）.fadeIn（100）; 
 $（＃register-form）。延迟（100）.fadeOut（100）; 
 $（'＃register-form-link'）。removeClass（'active'）; 
 $（this）.addClass（'active'）; 
 e.preventDefault（）; 
} ）; 
 $（'＃register-form-link'）。click（function（e）{
 debugger; 
 $（＃register-form）。delay（100）。 fadeIn（100）; 
 $（＃login-form）。delay（100）.fadeOut（100）; 
 $（'＃login-form-link'）。removeClass（'active' ）; 
 $（this）.addClass（'active'）; 
 e.preventDefault（）; 
}）; 
 
}）

这是用于登录和注册标签的JavaScript ...当我点击注册标签时，它还会显示登录表格，即

 $（＃login-form）。延迟（100）.fadeOut（100）; 

工作不正常。任何建议无线会很乐意





这是HTML代码：

< div id =regContainerclass =container> 
< div class =row> 
< div class =col-md-6 col-md-offset-3> 
< div class =panel panel-login> 
< div class =panel-heading> 
< div class =row> 
< div class =col-xs-6> 
< a href =＃class =activeid =login-form-link>登录< / a> 
 
< / div> 
< div class =col-xs-6> 
< a href =＃id =register-form-link>注册< / a> 
 
< / div> 
< / div> 
< hr> 
< / div> 
< div class =panel-body> 
< div class =row> 
< div class =col-lg-12> 
< form id =login-formaction =＃method =postrole =form> 
< div class =form-group> 
< label for =username>用户名< / label> 
< input type =textname =usernameid =usernametabindex =1class =form-controlplaceholder =Usernamevalue => 
< / div> 
< div class =form-group> 
< label for =password>密码< / label> 
< input type =passwordname =passwordid =passwordtabindex =2class =form-controlplaceholder =Password> 
< / div> 
< div class =form-group text-center> 
< input type =checkboxtabindex =3class =name =rememberid =remember> 
< label for =remember>记住我< / label> 
< / div> 
< div class =form-group> 
< div class =row> 
< div class =col-sm-6 col-sm-offset-3> 
< input type =submitname =login-submitid =login-submittabindex =4class =form-control btn btn-loginvalue =登录> 
< / div> 
< / div> 
< / div> 
< / form> 
< form id =register-formaction =＃method =postrole =formstyle =display：none; > 
< div class =form-group> 
< label for =username>用户名< / label> 
< input type =textname =usernameid =usernametabindex =1class =form-controlplaceholder =Usernamevalue => 
< / div> 
< div class =form-group> 
< label for =password>密码< / label> 
< input type =passwordname =passwordid =passwordtabindex =2class =form-controlplaceholder =Password> 
< / div> 
< div class =form-group> 
< label for =confirm-password>确认密码< / label> 
< input type =passwordname =confirm-passwordid =confirm-passwordtabindex =2class =form-controlplaceholder =Confirm Password> 
< / div> 
< div class =form-group> 
< div class =row> 
< div class =col-sm-6 col-sm-offset-3> 
< input type =submitname =register-submitid =register-submittabindex =4class =form-control btn btn-registervalue =立即注册> 
< / div> 
< / div> 
< / div> 
< / form> 
< / div> 
< / div> 
< / div> 
< / div> 
< / div> 
< / div> 
< / div> 

我尝试过：



我试过hide（），show（），但它给出了相同的输出

解决方案

（function（）{

（'＃login-form-link'）。click（function（e）{
debugger;

（＃login-form ）.delay（100）.fadeIn（100）;

$(function () {

    $('#login-form-link').click(function (e) {
        debugger;
        $("#login-form").delay(100).fadeIn(100);
        $("#register-form").delay(100).fadeOut(100);
        $('#register-form-link').removeClass('active');
        $(this).addClass('active');
        e.preventDefault();
    });
    $('#register-form-link').click(function (e) {
        debugger;
        $("#register-form").delay(100).fadeIn(100);
        $("#login-form").delay(100).fadeOut(100);
        $('#login-form-link').removeClass('active');
        $(this).addClass('active');
        e.preventDefault();
    });

})

This is JavaScript for Login and registration tab...when I click on Registration tab it also shows Login form i.e

$("#login-form").delay(100).fadeOut(100);

is not working properly .any suggestion will be helpful


this is HTML code:

<div id="regContainer" class="container">
      <div class="row">
      <div class="col-md-6 col-md-offset-3">
        <div class="panel panel-login">
          <div class="panel-heading">
            <div class="row">
              <div class="col-xs-6">
                    <a href="#" class="active" id="login-form-link">Login</a>
               
              </div>
              <div class="col-xs-6">
                <a href="#" id="register-form-link">Register</a>
                    
              </div>
            </div>
            <hr>
          </div>
          <div class="panel-body">
            <div class="row">
              <div class="col-lg-12">
                <form id="login-form" action="#" method="post" role="form"  >
                  <div class="form-group">
                    <label for="username">Username</label>
                    <input type="text" name="username" id="username" tabindex="1" class="form-control" placeholder="Username" value="">
                  </div>
                  <div class="form-group">
                    <label for="password">Password</label>
                    <input type="password" name="password" id="password" tabindex="2" class="form-control" placeholder="Password">
                  </div>
                  <div class="form-group text-center">
                    <input type="checkbox" tabindex="3" class="" name="remember" id="remember">
                    <label for="remember"> Remember Me</label>
                  </div>
                  <div class="form-group">
                    <div class="row">
                      <div class="col-sm-6 col-sm-offset-3">
                        <input type="submit" name="login-submit" id="login-submit" tabindex="4" class="form-control btn btn-login" value="Log In">
                      </div>
                    </div>
                  </div>
                </form>
                <form id="register-form" action="#" method="post" role="form" style="display:none;" >
                  <div class="form-group">
                    <label for="username">Username</label>
                    <input type="text" name="username" id="username" tabindex="1" class="form-control" placeholder="Username" value="">
                  </div>
                  <div class="form-group">
                    <label for="password">Password</label>
                    <input type="password" name="password" id="password" tabindex="2" class="form-control" placeholder="Password">
                  </div>
                  <div class="form-group">
                    <label for="confirm-password">Confirm password</label>
                    <input type="password" name="confirm-password" id="confirm-password" tabindex="2" class="form-control" placeholder="Confirm Password">
                  </div>
                  <div class="form-group">
                    <div class="row">
                      <div class="col-sm-6 col-sm-offset-3">
                        <input type="submit" name="register-submit" id="register-submit" tabindex="4" class="form-control btn btn-register" value="Register Now">
                      </div>
                    </div>
                  </div>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

What I have tried:

I tried hide(),show(), but it gives same output

解决方案

(function () {

('#login-form-link').click(function (e) { debugger;

("#login-form").delay(100).fadeIn(100);

这篇关于Javascript无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！