jQuery переключает классы и браузер

Question

У меня есть очень простой toggleClass, который изменяет внешний вид ссылки при нажатии на нее.Отлично работает, за исключением одной вещи.Каждый раз, когда я нажимаю на ссылку, фокус браузера снова смещается к верхней части страницы.Это становится довольно раздражающим, если ссылка находится в самом низу страницы.

Я мог бы использовать другой элемент, такой как span of coarse, но мне любопытно узнать, есть ли решение моего вопроса.

Пример используемой ссылки:

<a class="share-this" href="#">Share This</a>

Answer 1

или эта функция также может помочь :

$('.share-this').toggleClass('some-class-that-is-toggled').click(function(e) {
    return false;
});

Answer 2

Когда вы нажимаете на ссылку, она переходит на '#', указанный в href, который выводит ваш экран наверх.

Что вам нужно сделать, так это предотвратить это действие браузера по умолчанию.Вы можете сделать это, обработав событие click и предотвратив его всплывание (которое затем обработает браузер).

Вы можете запретить действие щелчка по умолчанию следующим образом:

$('.share-this').toggleClass('some-class-that-is-toggled').click(function(e) {
    e.preventDefault();
});

Answer 3

Зачем использовать ссылку, если вы никуда не собираетесь?Просто добавьте код переключения к какому-нибудь другому типу элемента.Это не только позволит избежать обхода, но и будет более семантически корректным и понятным в обслуживании.

Answer 4

Решение ->

<a class="share-this" href="javascript:void(0);">Share This</a> 

Это происходит из-за того, что href="#" использует "javascript:void(0);" вместо #.

это также изменяет ваш URL, например

http://localhost:8080/appname Для http://localhost:8080/appname#