Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 27.05.2010, 15:08
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

Выбрать все, кроме одного div'а. Как?
Здравствуйте.
Необходимо сделать, чтобы форма авторизации всплывала при нажатии на ссылку и исчезала при клике в любом месте, кроме всплывающего блока с формой.

Подскажите как это сделать?? Не могу сделать вторую часть задачи (выбрать все, кроме всплывающего блока).

<body>
<p class="login"><a href="#">Log in</a></p>
<div id="appearing-box"> 
   <form action="">
      <fieldset>
         <table>
		    <tr>
			   <td>Логин:</td>
			   <td><input type="text" value="" /></td>
			</tr>
			<tr>
			   <td>Пароль:</td>
			   <td><input type="password" value="" /></td>
			</tr>
			<tr>
			   <td></td>
			   <td><input type="submit" value="Войти" /></td>
			</tr>
		 </table>
	  </fieldset> 
   </form>	    	    
</div>
</body>

$(document).ready(function(){
    $("p.login a").click(function(){ 
        $("#appearing-box").show("fast");
        return false;
    })
     $(":not(#appearing-box)").click(function(){
        $("#appearing-box").hide()
    })
});
Ответить с цитированием
  #2 (permalink)  
Старый 27.05.2010, 15:12
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

Ставим onclick на весь документ, смотрим, не является ли event.target нужным вам блоком (или его потомком), если нет — скрываем блок.
Ответить с цитированием
  #3 (permalink)  
Старый 27.05.2010, 15:24
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

Сообщение от exec Посмотреть сообщение
Ставим onclick на весь документ, смотрим, не является ли event.target нужным вам блоком (или его потомком), если нет — скрываем блок.
А в коде это как выглядеть будет?? Напишите, если не сложно.
Ответить с цитированием
  #4 (permalink)  
Старый 27.05.2010, 15:40
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

$(document).click(function(e) {
e = e || window.event;
t = e.target || e.srcElement;
if (!$(t).is('#block') && !$(t).parents().find('#block').size()==0) {
$('#block').hide();
}
});
Ответить с цитированием
  #5 (permalink)  
Старый 27.05.2010, 15:52
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

$(document).click(function(e){ 
	    e = e || window.event; 
	    t = e.target || e.srcElement; 
	    if (!$(t).is('#appearing-box') && $(t).parents().find('#appearing-box').size()==0) { 
	       $('#appearing-box').hide(); 
	    } 
	});

Убрал отрицание у второго условия. Иначе был обратный эффект.

Еще, не могли бы вы раскрыть смысл 2-ой и 3-ей строк. Не совсем понятно, что это.
А селектором :not нельзя тут обойтись??

Последний раз редактировалось Юрий Шу, 27.05.2010 в 15:59.
Ответить с цитированием
  #6 (permalink)  
Старый 27.05.2010, 16:37
Аватар для e1f
e1f e1f вне форума
Профессор
Отправить личное сообщение для e1f Посмотреть профиль Найти все сообщения от e1f
 
Регистрация: 03.04.2009
Сообщений: 1,263

Юрий Шу, ввиду того, что используется jQuery, 2-3 строки смысла лишены совершенно -- это нормализация события и target'a, она делается jQuery до обработчика.
Ответить с цитированием
  #7 (permalink)  
Старый 27.05.2010, 16:44
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

e1f, то есть это как-то сократить можно?
что такое target подскажите тоже…
Ответить с цитированием
  #8 (permalink)  
Старый 27.05.2010, 16:47
Аватар для e1f
e1f e1f вне форума
Профессор
Отправить личное сообщение для e1f Посмотреть профиль Найти все сообщения от e1f
 
Регистрация: 03.04.2009
Сообщений: 1,263

$(document).click(function(e){
    if (!$(e.target).closest('#appearing-box').length) {
        $('#appearing-box').hide();
    }
});


target либо srcElement (смотря где) -- тот элемент, который инициировал событие
Ответить с цитированием
  #9 (permalink)  
Старый 27.05.2010, 16:57
Аспирант
Отправить личное сообщение для Юрий Шу Посмотреть профиль Найти все сообщения от Юрий Шу
 
Регистрация: 27.05.2010
Сообщений: 42

Сообщение от e1f Посмотреть сообщение
target либо srcElement (смотря где) -- тот элемент, который инициировал событие
это от браузера, я так понимаю, зависит?
Ответить с цитированием
  #10 (permalink)  
Старый 27.05.2010, 17:37
Аватар для e1f
e1f e1f вне форума
Профессор
Отправить личное сообщение для e1f Посмотреть профиль Найти все сообщения от e1f
 
Регистрация: 03.04.2009
Сообщений: 1,263

Да. Это приведение к кроссбраузерному виду.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вопрос по replace. Как заменить все точки в строке? Pluto Общие вопросы Javascript 14 21.04.2017 12:32
не могу открыжить все чекбоксы нажатием одного nenastiy Events/DOM/Window 11 23.05.2010 17:50
Как получить все атрибуты ноды? Victor_85 Events/DOM/Window 1 12.04.2010 17:58
Выбрать все элементы кроме $(this) shustrikk jQuery 2 13.03.2010 14:17
глюк форума Gvozd Сайт Javascript.ru 11 18.03.2009 14:37