Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Повесить событие click (jQuery) на весь документ, кроме нескольких элементов (https://javascript.ru/forum/events/6132-povesit-sobytie-click-jquery-na-ves-dokument-krome-neskolkikh-ehlementov.html)

dabutch 12.11.2009 14:18

Повесить событие 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>


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

Прошу помочь.

e1f 12.11.2009 15:07

<!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>

dabutch 12.11.2009 18:52

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


Часовой пояс GMT +3, время: 13:15.