snehalpawar Ответов: 1

Javascript не работает

$(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();
    });

})



Это JavaScript для вкладки входа и регистрации...когда я нажимаю на вкладку регистрации, она также показывает форму входа, т. е. 
$("#login-form").delay(100).fadeOut(100);
не работает должным образом .любое предложение будет полезным


это HTML код:
<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>


Что я уже пробовал:

Я пробовал hide (), show (), но это дает тот же результат

Patrice T

"не работает должным образом" скажите, что он делает неправильно, скажите, чего вы ожидаете.

Karthik_Mahalingam

использовать  Ответить  кнопка, чтобы отправить комментарии / запрос пользователю, чтобы пользователь получил уведомление и ответил на ваш текст.

snehalpawar

когда я нажимаю на вкладку Регистрация, она показывает как форму входа в систему, так и регистрационную форму. согласно java-скрипту, форма входа в систему должна быть FadeOut..Но это не работает...

Patrice T

Воспользуйся Улучшить вопрос чтобы обновить ваш вопрос.
Чтобы каждый мог обратить внимание на эту информацию.

Karthik_Mahalingam

я проверил ваш код, он отлично работает.. возможно, вы что-то упустили, убедитесь, что все ссылки добавлены правильно.

snehalpawar

какой файл ссылок? Не могли бы вы помочь мне с этим

Karthik_Mahalingam

JS файлы

snehalpawar

bootbox.min.js
bootstrap-select.js
bootstrap.min.js
jquery-1.11.3.min.js

поправьте меня, если чего-то не хватает

Karthik_Mahalingam

это то, что я пробовал


<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script>
        $(function () {

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

        })
    </script>
</head>
<body>
    <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>

snehalpawar

этот код работает...Спасибо

Karthik_Mahalingam

Добро пожаловать

Patrice T

вы должны опубликовать это как решение. по крайней мере, это уберет вопрос из списка без ответа.

1 Ответов

Рейтинг:
9

Karthik_Mahalingam

Публикация в качестве решения на основе комментариев от ppolymorphe [^] 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script>
        $(function () {
 
            $('#login-form-link').click(function (e) {
                debugger;
                $("#login-form").delay(0).fadeIn();
                $("#register-form").delay(0).fadeOut(0);
                $('#register-form-link').removeClass('active');
                $(this).addClass('active');
                e.preventDefault();
            });
            $('#register-form-link').click(function (e) {
                debugger;
                $("#register-form").delay(0).fadeIn(0);
                $("#login-form").delay(0).fadeOut(0);
                $('#login-form-link').removeClass('active');
                $(this).addClass('active');
                e.preventDefault();
            });
 
        })
    </script>
</head>
<body>
    <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>