Я лично использую их в комбинации. Например:
HTML
<a href="#">Link</a>
с небольшим количеством jQuery
$('a[href="#"]').attr('href','javascript:void(0);');
или
$('a[href="#"]').click(function(e) {
e.preventDefault();
});
Но я использую это только для предотвращения перехода страницы наверх, когда пользователь нажимает на пустой якорь. Я редко использую onClick и другие on
события прямо в HTML.
Я бы предложил использовать элемент <span>
с атрибутом class
вместо
якорь. Например:
<span class="link">Link</span>
Затем присвойте этой функции .link
со сценарием, заключенным в тело и непосредственно перед тегом </body>
или во внешний документ JavaScript.
<script>
(function($) {
$('.link').click(function() {
// do something
});
})(jQuery);
</script>
* Примечание: Для динамически создаваемых элементов используйте:
$('.link').on('click', function() {
// do something
});
А для динамически создаваемых элементов, которые создаются с помощью динамически создаваемых элементов, используйте:
$(document).on('click','.link', function() {
// do something
});
Затем вы можете стилизовать элемент span, чтобы он выглядел как якорь с небольшим количеством CSS:
.link {
color: #0000ee;
text-decoration: underline;
cursor: pointer;
}
.link:active {
color: red;
}
Вот jsFiddle пример вышеупомянутого.