Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.11.2009, 14:18
Новичок на форуме
Отправить личное сообщение для dabutch Посмотреть профиль Найти все сообщения от dabutch
 
Регистрация: 23.03.2009
Сообщений: 6

Повесить событие click (jQuery) на весь документ, кроме нескольких элементов
Доброго всем времени суток,

приведённый ниже код выводит ссылку, при клике по которой открывается слой "текст". Я хочу чтобы при клике по любому элементу документа кроме собственно самого слоя "текст" слой "текст" закрывался. Я думал что это будет просто...


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<script language="JavaScript" type="text/javascript" src="jquery.js"></script>
</head>
<script language="JavaScript"><!--
function show_text(event, text) {
	if ($('div#text').length) return false;
	$('body').prepend('<div id="text" style="width:300px;height:50px;border:solid 1px #f00;">' + text + '</div>');
	event.stopPropagation();
	// $('body:not(div#text)').bind('click', remove_text);
	// $('body').not('div#text').bind('click', remove_text);
	// $('body:not(div#text)').live('click', remove_text);
	// $('body').live('click', remove_text);
	$('body').bind('click', remove_text);
	$('div#text').unbind('click', remove_text);
}
function remove_text() {
	$('div#text').remove();
	$('body').unbind('click', remove_text);
}
// --></script>
<body>
<p><a href="/images/img.jpg" target="_blank" onclick="show_text(event, 'some text');return false;">click</a></p>
</body>
</html>


Слой "текст" закрывается при клике по любому элементу, в т.ч. и самому слою "текст" (чего не должно быть). Закомментированные строки - различные опробованные мною вариации назначения обработки события клика.

Прошу помочь.
Ответить с цитированием
  #2 (permalink)  
Старый 12.11.2009, 15:07
Аватар для e1f
e1f e1f вне форума
Профессор
Отправить личное сообщение для e1f Посмотреть профиль Найти все сообщения от e1f
 
Регистрация: 03.04.2009
Сообщений: 1,263

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
    <title>Untitled Document</title>
    <script type="text/javascript" src="jquery-1.3.2.js"></script>
</head>
<script type="text/javascript">
<!--
function show_text(event, text) {
    if ($('#text').length) return false;
    $('body').prepend('<div id="text" style="width:300px;height:50px;border:solid 1px #f00;"><span>' + text + '</span></div>');
    event.stopPropagation();
    $(document).click(function(e){
        var target = $(e.target);
        if (target.is('#text') || target.parents('#text').length) return;
        $(document).unbind('click', arguments.callee);
        $('div#text').remove();
    });
}
//-->
</script>
<body>
<p><a href="/images/img.jpg" target="_blank" onclick="show_text(event, 'some text');return false;">click</a></p>
</body>
</html>

Последний раз редактировалось e1f, 12.11.2009 в 15:09.
Ответить с цитированием
  #3 (permalink)  
Старый 12.11.2009, 18:52
Новичок на форуме
Отправить личное сообщение для dabutch Посмотреть профиль Найти все сообщения от dabutch
 
Регистрация: 23.03.2009
Сообщений: 6

Большое спасибо! Отлично работает!
Ответить с цитированием
Ответ



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

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