Форум

RodgerFox · #1 (**permalink**) 02.05.2013, 16:37

Добрый день, уважаемые пользователи форума.
Подскажите пожалуйста, что я делаю не так.
Есть ссылка, при нажатии появляется соседний блок, при нажатии опять на ссылку или вне появившегося блока он должен прятаться, ну все как обычно. Только прячется он почему то, только при повторном нажатии на ссылку.
Листинг:

$(document).ready(function(){

var button = $('#logina');
        var box = $('#container');
        var form = $('#loginForm');
button.removeAttr('href');
$("a#logina").click(function (login) {
   box.toggle();
                box.addClass("act-box");
                button.addClass('active');
        
});
        form.click(function() { 
                return false;
        });
//вот тут что то не так. условие, типа нажатие вне области блока формы, то закрытие. 
        $(this).click(function(login) {
                if(!($(login.target).parent('#logina').length > 0)) {
                        button.removeClass('active');
                        box.toogle();
                        box.removeClass("act-box");
                }
        });
});

И сама шатамэлочка:

<a href="#" id="logina">login</a>
  <div id="container">
<form id="loginForm">
<h2>hellow, world</h2>
</form>
  </div>

p.s. убираем атрибут href ибо если js работает в браузере то пусть открывает форму, если нет, как обычная ссылка на другую стр.
Подскажите пожалуйста, что делаю не так? >.<

cyber · #2 (**permalink**) 02.05.2013, 19:28

RodgerFox, может потому что вы не обрабатывает клик в не блока?)

RodgerFox · #3 (**permalink**) 02.05.2013, 22:20

Простите, не понял. там в 17 строчке, я как бы обращаюсь к функции логин, а дальше проверка в ней был клик или нет, если нет то исп toogle();

cyber · #4 (**permalink**) 02.05.2013, 22:49

RodgerFox, сори не увидел что this ,в данном случае это документ, мне привычней чистый js, щас глянем)

cyber · #5 (**permalink**) 02.05.2013, 22:57

RodgerFox,
я конечно не особо шарю в jquery но метод вроде toggle а не toоgle

RodgerFox · #6 (**permalink**) 04.05.2013, 13:15

все равно, не как =\

cyber · #7 (**permalink**) 04.05.2013, 14:14

сделал пример на чистом js

<!DOCTYPE HTML>
<html>
  <head>
    <style>
      .open {
          display:block;
        
        }
        
        
        .close{
       
            display:none;
          
          }
    
    </style>
    
  </head>
  <body>
<a href="#" id="login">login</a>
  <div id="container">
<form id="loginForm">
<h2>hellow, world</h2>
</form>
  </div>
    <script>

      function $(selector){//используеться что бы не писать document.getElement...
      
      return document.querySelector(selector);
      
      }  
    
      
      !function () {
      
      
      
        var cont = $("#container");
        cont.className = "open";
        
        
        document.body.onclick = function (e) {
        
        
          var target = event.srcElement||e.target  ;
        
          
          if(target.id == "login"){
          
            ChangeStateContainer();
          
            return false;
          }
          
          
          cont.className = "close";
        };
      
      
        function ChangeStateContainer()
        {
        
          if(cont.className == "open"){
        
            cont.className = "close";
          }
          
          else cont.className = "open";
        
        }
      
      }();


    </script>

  </body>
</html>

Hekumok · #8 (**permalink**) 04.05.2013, 22:11

$(this).click(function(login) {
		if(!($(login.target).closest("#logina").length)) {
			button.removeClass('active');
			box.toogle();
			box.removeClass("act-box");
		};
	});

Форум

Справочник

Discord чат

Курсы javascript