Форум

abc_ua · #1 (**permalink**) 09.03.2011, 01:32

Помогите пожалуйста с кодом, в мозиле (3.5.16) не происходит остановка всплытия события, в остальных браузерах все нормально

<!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=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body onclick="alert('body')">
	<div onclick="dc()" style="width:100px; height:100px; background:#CC6600;"></div>
	<script>
		function dc() {
			alert('div');
			stop_bubbling(event);
		}
		function stop_bubbling(e) {
			e = e || window.event
			if (e.stopPropagation) e.stopPropagation();
			else e.cancelBubble = true;
		}
	</script>
</body>
</html>

Aetae · #2 (**permalink**) 09.03.2011, 01:38

Кто такой event в dc() ? Правильно window.event .
В фф его нет и не будет, у "остальных" его тоже быть не должно, но совместимость с ие, будь она неладна.

<!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=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body onclick="alert('body')">
	<!--Зато event кроссбраузерно есть во встраиваемых обработчиках-->
	<div onclick="dc(*!*event*/!*)" style="width:100px; height:100px; background:#CC6600;"></div>
	<script>
		function dc(e) {
			alert('div');
			stop_bubbling(e);
		}
		function stop_bubbling(e) {
			if (e.stopPropagation) e.stopPropagation();
			else e.cancelBubble = true;
		}
	</script>
</body>
</html>

abc_ua · #3 (**permalink**) 09.03.2011, 02:22

а как назначить обработчик из скрипта?

<!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=utf-8" />
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>

<body>
	<div style="width:100px; height:100px; background:#CC6600;"></div>
	<script>
		$("body").click(function() {alert("body");});

		$("div").bind("click", function() {
			alert(this);
			stop_bubbling(this);
		});
		
		function stop_bubbling(element) {
			element.onclick = function(event) {
				event = event || window.event
				if (event.stopPropagation) event.stopPropagation();
				else event.cancelBubble = true;
			}
		}
	</script>
</body>
</html>

не работает

Aetae · #4 (**permalink**) 09.03.2011, 02:26

С чего бы ему работать то, блин.

$("div").bind("click", function(e) {
            alert(this);
            stop_bubbling(e);
        });
        function stop_bubbling(event) {
                event = event || window.event
                if (event.stopPropagation) event.stopPropagation();
                else event.cancelBubble = true;
        }

Хотя в этом вашем унылом жкуери ни зуб ногой.

abc_ua · #5 (**permalink**) 09.03.2011, 02:28

спасибо, работает, буду разбираться

<!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=utf-8" />
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>

<body>
	<div style="width:100px; height:100px; background:#CC6600;"></div>
	<script>
		$("body").click(function() {alert("body");});

		$("div").bind("click", function(e) {
			alert(this);
			stop_bubbling(e);
		});
		
		function stop_bubbling(e) {
			if (e.stopPropagation) e.stopPropagation();
            else e.cancelBubble = true;
		}
	</script>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript