Я надеюсь, что в сообществе разработчиков js у нас может быть консенсус по этому поводу:
Должны ли мы объявлять события onclick, onkeyup... и т.д. внутри или вне нашего HTML-документа?
1) Я предпочитаю иметь их отдельно. Истинный. 2) Я также знаю, что HTML5 добавляет в игру новые интерактивные элементы...
С уважением, МЕМ.
В идеале, если вы можете определить свой код события и прикрепить эти события к соответствующим элементам в отдельных файлах JS. Разделяйте JS и HTML везде, где это возможно.
Написание встроенных обработчиков событий было абсолютно плохой идеей, по крайней мере, десятилетие.
Даже доступ к таким свойствам, как «element.onkeyup», — довольно плохая идея.
Используйте слушателей. А еще лучше каркас.
EDIT: И вот почему комментарий Тима Дауна нелеп:
Если обоснование ЛЮБОГО решения по программированию начинается со слов "если вы знаете, что вам когда-нибудь понадобится...", то не делайте этого. Серьезно.
«Все браузеры с поддержкой сценариев» на самом деле означают IE5.5+ FF2+ Safari 3+ Opera 9+. Это охватывает более 99% веб-пользователей, и все эти браузеры поддерживают прослушиватели событий. Прослушиватели событий имеют большие преимущества по сравнению с доступом к свойствам обработчиков событий — большое из них заключается в том, что для любого события может быть более одного прослушивателя. В современном программировании на Javascript это происходит постоянно. Использовать специальный код для использования устаревшей системы обработки событий только потому, что вы можете это сделать, — ужасная идея, враждебная по отношению к действительно хорошим идеям, таким как использование библиотек и написание ненавязчивого, согласованного кода.
return false; — это совершенно нелогичный и антисемантический способ означать «прекратить всплывать/распространять это событие вверх/вниз по дереву DOM». Знаете, что интуитивно? Общие выражения в коде библиотеки, такие как event.stop().
element, тогда element.onkeyup — это то, что вам нужно. Во-первых, он работает во всех браузерах, поддерживающих сценарии, и работает во всех них одинаково (за исключением того, откуда вы получаете объект события). Во-вторых, механизм предотвращения поведения по умолчанию для события просто return false; во всех браузерах.
- person Tim Down; 23.08.2010
return false означает не то, что вы говорите. Это означает, что не следует выполнять действие браузера по умолчанию.
- person Tim Down; 23.08.2010
return false не останавливает распространение события. Моя первоначальная точка зрения о return false заключалась в том, что она поддерживается повсеместно. Я не пытался ничего сказать о том, является ли return false разумным выбором синтаксиса для того, что он делает; Я не уверен, что event.stop() лучше (остановить что именно?), и в любом случае не служит той же цели.
- person Tim Down; 23.08.2010
Текущее популярное мнение состоит в том, что все должно быть ненавязчивым, а это означает, что свойства обработчика событий, такие как someElement.onclick = function(e) { ... };, широко осуждаются, а атрибуты обработчика событий, такие как <input type="button" onclick="doSomething()">, полностью игнорируются. На самом деле, есть допустимые применения для обоих.
Желание отделить поведение (такое как обработчики событий) от содержимого является естественным и важным, но не единственным соображением. Как показано в сводке ниже, у трех методов создания обработчиков событий есть свои преимущества и недостатки, и в конкретной ситуации разделение поведения и содержимого может не иметь решающего значения.
В заключение, для данной задачи используйте самый простой метод, который соответствует вашим потребностям.
myElement.onclick = function(e) { alert("Clicked"); };
Они особенно полезны для назначения обработчика событий элементу, который вы создаете в сценарии, и наверняка потребуется только один слушатель.
window.event в IE, параметр функции в других браузерах).return false<input type="button" value="test" onclick="alert('Clicked');">
Это единственный подход, который работает, когда важно, чтобы элемент реагировал на событие до завершения загрузки документа (см. все еще" rel="nofollow noreferrer">http://peter.michaux.ca/articles/the-window-onload-problem-still для более подробного обсуждения этого вопроса). Кроме того, это самый простой способ добавить обработчики событий.
return falsemyElement.addEventListener("click", function(e) { alert("Clicked"); }, false);
Это единственный метод, позволяющий прикрепить несколько слушателей к конкретному событию на конкретном объекте. addEventListener стандартизирован в спецификации событий DOM Level 2.
addEventListener — это современный стандарт, поддерживаемый в IE 9, что означает, что все текущие основные браузеры будут поддерживаться после выпуска IE 9.attachEvent в IE не совсем эквивалентно addEventListenerthis в функции прослушивателя и как вы передаете объект Event в функцию прослушивателя. И то, и другое легко решается, но знать о них нужно.
- person Tim Down; 23.08.2010
