Как я могу создать пустой HTML-привязку, чтобы страница не “подпрыгивала”, когда я нажимаю на нее?
-
20-08-2019 - |
Вопрос
Я работаю над некоторым jQuery, чтобы скрыть / показать некоторый контент, когда я нажимаю на ссылку.Я могу создать что-то вроде:
<a href="#" onclick="jquery_stuff" />
Но если я нажму на эту ссылку во время прокрутки страницы вниз, она снова переместится в начало страницы.
Если я сделаю что-то вроде:
<a href="" onclick="jquery_stuff" />
Страница перезагрузится, что избавит страницу от всех изменений, внесенных javascript.
Что- то вроде этого:
<a onclick="jquery_stuff" />
Даст мне желаемый эффект, но он больше не отображается как ссылка.Есть ли какой-нибудь способ указать пустой якорь, чтобы я мог назначить обработчик javascript для onclick
событие, ничего не меняя на странице и не перемещая полосу прокрутки?
Решение
Поставьте "return false;" на второй вариант:
<a href="" onclick="jquery_stuff; return false;" />
Другие советы
Тебе нужно return false;
после того , как jquery_stuff
:
<a href="no-javascript.html" onclick="jquery_stuff(); return false;" />
Это отменит действие по умолчанию.
Вы можете выразиться просто, как показано ниже:
<a href="javascript:;" onclick="jquery_stuff">
В jQuery есть встроенная для этого функция, которая называется preventDefault
который можно найти здесь:http://api.jquery.com/event.preventDefault/
Вот их пример:
<script>
$("a").click(function(event) {
event.preventDefault();
});
</script>
Вы также можете создать ссылку следующим образом:
<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>
Проверьте комментарий eyelidless (используйте кнопку, а не якорь).Как раз собирался опубликовать тот же совет.Якорь, который не ссылается на ресурс, а просто выполняет скрипт, должен быть реализован в виде кнопки.
Прекратите помещать свои обработчики событий в HTML и прекратите использовать теги привязки которые не служат целям привязки семантики.Используйте кнопку и добавьте обработчик кликов в свой Javascript.Пример:HTML
<button id="jquery_stuff">Label</button>
и JavaScript$('#jquery_stuff').click(jquery_stuff);
.Вы можете использовать CSS для оформления кнопки , чтобы она выглядела как ссылка, удалив отступы, границы, отступы и цвет фона, затем добавив свои стили ссылок (например.цвет и оформление текста).– отсутствие век 19 '10 октября в 17:40
<a href="javascript:;" onclick="jquery">link</a>
href
требуется что-то там, если вы хотите, чтобы это не приводило к появлению ошибок в валидаторах для html.В javascript:;
является хорошим держателем места.
Если вы действительно хотите использовать #
:
<a href="#me" name="me" onclick="jquery">link</a>
Будьте осторожны с return false;
, это останавливает поведение по умолчанию всего, что вы делаете.
Кроме того, если ваш js похож на submit, вы можете столкнуться с проблемами в Internet Explorer.
<a href="javascript:// some helpful comment " onclick="jquery_stuff" />
Обычно я использую <span>
и оформите его так, чтобы он выглядел как ссылка, когда мне нужно выполнить что-то подобное.
<a href="#" class="falseLinks">Link1</a>
<a href="#" class="falseLinks">Link2</a>
и т.д..
JQUERY - JQUERY - ЗАПРОС:
$(function() {
$("a.falseLinks").click(function() {
// ...other stuff you want to do when links is clicked
// This is the same as putting onclick="return false;" in HTML
return false;
})
});
@eyelidless был немного придурковат в том, как он это сказал, но он был прав.Это самый чистый способ сделать это.Зачем использовать jQuery, если затем вы собираетесь вернуться к ванильному Javascript для того, что jQuery делает проще и чище?
Обычно я так и делаю:
<a style="cursor:pointer;" onclick="whatever();">Whatever</a>
Как насчет этого:
<a href="#nogo" onclick="foo();">some text</a>