Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 21.01.2015, 15:36
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 2,932

Сообщение от skrudjmakdak
нажали не на дивку с инпутом
Нет смысла. Меню же все равно исчезнет, даже при нажатии на само меню. Поэтому просто:

window.onclick = input.onblur = function() {
    menu.style.display = 'none';
};
Ответить с цитированием
  #12 (permalink)  
Старый 22.01.2015, 07:13
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

Ruslan_xDD,
тогда вообще не надо событие на window ставить:
input.onblur = function() {
    menu.style.display = 'none';
};

т.к. blur выскакивает первым, чем click по window. но прикол тогда в том, что если мы закроем меню при blur то события клика по этому меню мы не увидим
Ответить с цитированием
  #13 (permalink)  
Старый 22.01.2015, 07:36
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 2,932

skrudjmakdak, если меню будет исчезать плавно через transition, то увидим по идее. Или скрывать меню не сразу, по минимальному setTimeout`у.

Но я бы на твоём месте забыл про blur, сделал бы по клику и проверял бы, что если клик произошёл не по input, то меню скрываем, а если по input - открываем.

<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>
    <input id="test" type="text">
    <div id="menu" style="border: 1px solid #555; display: none; height: 100px; width: 170px"></div>

    <script>
      var menuIsHide = true;
      
      window.addEventListener('click', function(e) {
        var self = e.target;
        if(self.id == 'test' == menuIsHide) {
          menu.style.display = menuIsHide ? 'block' : 'none';
          menuIsHide = !menuIsHide;
        }
      });
    </script>

  </body>
</html>
Ответить с цитированием
  #14 (permalink)  
Старый 22.01.2015, 07:41
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

ну без таба у меня и так работает)))
Ответить с цитированием
  #15 (permalink)  
Старый 22.01.2015, 07:50
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 2,932

skrudjmakdak,

<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>
    <input id="test" type="text">
    <div id="menu" style="border: 1px solid #555; display: none; height: 100px; width: 170px"></div>

    <script>
      var menuIsHide = true;
      
      test.onblur = function() {
        menu.style.display = 'none';
        menuIsHide = true;
      };
      
      window.addEventListener('click', function(e) {
        var self = e.target;
        if(self.id == 'test' == menuIsHide) {
          menu.style.display = menuIsHide ? 'block' : 'none';
          menuIsHide = !menuIsHide;
        }
      });
    </script>

  </body>
</html>
Ответить с цитированием
  #16 (permalink)  
Старый 22.01.2015, 07:53
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 2,932

Или так:

<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>
    <input id="test" type="text">
    <div id="menu" style="border: 1px solid #555; display: none; height: 100px; width: 170px"></div>

    <script>
      var menuIsHide = true;
      
      window.onclick = test.onblur = function(e) {
        var self = e.target;
        if(e.type == 'blur' || (self.id == 'test' == menuIsHide)) {
          menu.style.display = menuIsHide ? 'block' : 'none';
          menuIsHide = !menuIsHide;
        }
      };
    </script>

  </body>
</html>
Ответить с цитированием
  #17 (permalink)  
Старый 22.01.2015, 08:20
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

посм чуть попозже, ща занят
Ответить с цитированием
  #18 (permalink)  
Старый 22.01.2015, 09:40
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от Ruslan_xDD
menuIsHide
Ну ты индеец )) menuIsHidden ("меню скрыто", а не "меню есть скрыть")
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #19 (permalink)  
Старый 22.01.2015, 09:46
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 2,932

danik.js, сам индеец. Я в английском не силён, так что пофиг.
Ответить с цитированием
  #20 (permalink)  
Старый 22.01.2015, 09:57
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

я задолблю)) не работает, выше писал почему

<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>
    <input id="test" type="text">
    <div id="menu" style="border: 1px solid #555; display: none; height: 100px; width: 170px" onclick="c(event)">
		<div>1</div>
		<div>2
			<div>2.1</div>
			<div>2.2</div>
			<div>2.3</div>
		</div>
		<div>3</div>
	</div>

    <script>
      var menuIsHide = true;
      
      window.onclick = test.onblur = function(e) {
        var self = e.target;
        if(e.type == 'blur' || (self.id == 'test' == menuIsHide)) {
          menu.style.display = menuIsHide ? 'block' : 'none';
          menuIsHide = !menuIsHide;
        }
      };
	  function c(e) {
		console.log(e.target);
	  }
    </script>

  </body>
</html>


очередь событий
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Очередь XML запросов Евгений М AJAX и COMET 4 01.02.2012 09:05
Переопределение событий lispik jQuery 4 13.01.2011 11:30
Скопировать обработчики событий с одного элемента на другой. Jurasmi Events/DOM/Window 3 10.11.2010 18:03
очередь событий прерывается alertом puchu Events/DOM/Window 8 15.07.2010 23:54
Очередь событий Petka jQuery 2 03.03.2010 11:21