Сначала объясните разницу между двумя методами предотвращения и Stoppropagation в JS:
Какова роль метода предотвращения? Мы знаем, например, <a href = "http://www.baidu.com"> Baidu </a>, это самая основная вещь в HTML. .baidu .. com, это поведение по умолчанию метки <a>, и метод предотвращения, чтобы не дать другим вещам возникать поведение по умолчанию. Смотрите абзац кода, и все понимают:
Код кода копирования следующим образом:
<!
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" /> />
<Title> JS предотвращает прыжок ссылки </title>
<script type = "text/javascript">
Функция stopdefault (e) {
if (e && e.preventdefault)
e.preventdefault ();
еще
window.event.returnvalue = false;
Вернуть ложь;
}
</script>
</head>
<тело>
<a href = "http://www.baidu.com" id = "testlink"> baidu </a>
<script type = "text/javascript">
var test = document.getElementById ('testLink');
test.onclick = function (e) {{
Alert («мой адрес ссылки: ' + this.href +', но я не буду прыгать»);
Stopdefault (e);
}
</script>
</body>
</html>
В настоящее время нажмите на ссылку Baidu, и вы не откроете http://www.baidu.com, но просто всплывают диалоговое окно предупреждения.
А как насчет метода остановки? Прежде чем говорить о методе StopPropagation, вы должны объяснить вам агента событий JS.
Прокси события используют две функции, которые часто игнорируются в инциденте Javasciprt: пузырьки событий и целевые элементы. Например, когда мышь нажимает на кнопку, и когда мышь нажимает кнопку, и одно и то же событие будет вызвано во всех предках этого элемента. Этот процесс называется инцидентом пузырьком; Для любого события его целевые элементы являются примитивными элементами, а в нашем примере, а также кнопка. Целевой элемент появляется в форме атрибутов в наших объектах события. Если вы используете агент события, мы можем добавить процессор события в элемент, подождать, пока событие будет пузырьком из его элементов Sub -Level, и сможем легко определить, с какого элемента начинается событие.
Метод Stoppropagation заключается в том, чтобы предотвратить пузырьковое событие JS и увидеть код.
Код кода копирования следующим образом:
<!
<Html xmlns = "http://www.w3.org/1999/xhtml" lang = "gb2312">
<голова>
<Title> Предотвратить передачу пузырьков JS (CancelBubble, StopPropagation) </title>
<Meta name = "Keywords" Content = "JS, пузырьки событий, CancelBubble, StopPropagation" />
<Скрипт>
Функция Dosomhething (obj, evt) {
предупреждение (obj.id);
var e = (evt)?
if (window.event) {
e.cancelbubble = true;
} Еще {
//e.preventdefault ();
e.stoppropagation ();
}
}
</script>
</head>
<тело>
<div id = "parent1" onclick = "alert (this.id)">
<p> это боль1 div
<div id = "Child1" onclick = "alert (this.id)">
<p> Это ребенок1
</div>
<p> это боль1 div
</div>
<br />
<div id = "parent2" onclick = "alert (this.id)">
<p> Это родитель2 div
<div id = "Child2" onclick = "dosomething (this, event);" >> ">
<p> Это Child2
</div>
<p> Это родитель2 div
</div>
</body>
</Html>
Давайте поймем код выше.