Ответ 1
Много раз вы увидите, что люди используют атрибут onclick и просто return false в конце его. Хотя это работает надежно, оно немного уродливо и может затруднить управление вашей базой кода.
<a href="#" onClick="submitComment(); return false;">
Отделите свой HTML-код от своего JavaScript
Это намного лучше для вас и вашего проекта, если вы отделите свою разметку от своих скриптов.
<a id="submit" href="enableScripts.html">Post Comment</a>
С помощью вышеуказанного HTML мы можем найти этот элемент и связать обработчик, когда пользователь нажимает на элемент. Мы можем сделать все это из внешнего .js файла, чтобы наш HTML-код оставался красивым и чистым, без каких-либо скриптов:
if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", setup, false);
} else if (document.attachEvent) {
document.attachEvent("onreadystatechange", setup);
} else {
document.onload = setup;
}
function setup () {
var submit, submitComment;
submit = document.getElementById("submit");
submitComment = function (e) {
e = e || window.event;
e.preventDefault();
alert("You clicked the link!");
};
if (submit.addEventListener) {
submit.addEventListener("click", submitComment, false);
} else if (submit.attachEvent) {
submit.attachEvent("onclick", submitComment);
} else {
submit["onclick"] = submitComment;
}
}
В приведенном выше коде много чего происходит, но пусть пробегает по нему от 30 000 футов. Мы начнем с выяснения того, как наилучшим образом настроить наш код, когда браузер загружает страницу вверх. В идеале мы хотели бы сделать это, когда DOM будет готов.
После нескольких условных проверок нам удается поручить браузеру выполнять нашу функцию после подготовки DOM (таким образом, наш якорный элемент существует для взаимодействия с его поведением).
Наша функция установки получает ссылку на этот якорь, создает функцию, которую мы будем запускать при нажатии на привязку, а затем находит способ привязать вызов этой функции к событию щелчка якоря - потеряв ваш разум еще? Это безумие, с которыми разработчикам JavaScript приходилось иметь дело в течение некоторого времени.
С jQuery это намного проще
Возможно, вы слышали о jQuery и задавались вопросом, почему он так популярен. Позвольте решить ту же проблему, но на этот раз с jQuery, а не с сырым ванильным JavaScript. Предполагая следующую разметку:
<a id="submit" href="enableScripts.html">Post Comment</a>
Единственный JavaScript, который нам нужен (благодаря jQuery), таков:
$(function(){
$("#submit").on("click", function(event){
event.preventDefault();
submitComment();
});
});
Что это - это все, что нужно. jQuery обрабатывает все тесты, чтобы определить, учитывая ваш браузер, что лучший способ сделать то или это. Он принимает все сложные вещи и перемещает его в сторону, чтобы вы могли быть творческими.