0

Есть выплывающий текст:

<div id="cat">
  <h4><a href="#" class="disabled" style="color:#737373; text-decoration:none">Вопрос?</a></h4>
        <p style="margin-top:10px;">
<em>Ответ</em>
        </p>
</div>

При нажатии на "Вопрос" страница поднимается вверх из-за "href="#"". Мне нужно, чтобы страница не поднималась, а оставалась на месте.
Пробовал через стили сделать ссылку некликабельной, работает но тогда пропадает cursor: pointer.

3
  • А если тегу а добавить Id и в href поставить ссылку на него?
    – Dmytro
    26 ноя 2017 в 19:42
  • замените решётку на javascript:
    – vp_arth
    26 ноя 2017 в 19:43
  • @vp_arthспасибо, заработало! 26 ноя 2017 в 19:47

2 ответа 2

4

Есть разные способы

1. Сделать onclick="return false".

Если функция onclick возвращает false то дальнейшая логика обработки ссылок перестаёт выполняться. Тут может быть любая функция которая возвращает false.

<a href="#" onclick="return false">link</a>

2. javascript://

<a href="javascript://">link</a>
4
  • Спасибо!!!!!!!! 26 ноя 2017 в 19:57
  • Пожалуйста..... 26 ноя 2017 в 19:58
  • А как сделать upvote? И подскажите, если не трудно, у меня есть <option>Новая Почта (Полная предоплата)</option> и на мобильных устройствах текст вылазит за сам option, не вмещается 26 ноя 2017 в 20:02
  • Рядом с ответом стоит число и стрелки верх и вниз, верх это upvote - Ответ полезен. 26 ноя 2017 в 20:03
2

event.preventDefault() - отменить действие по-умолчанию.

$(function() {
  $('a.disabled').on('click', function(event) {
    event.preventDefault();
  });
});
#cat {
  margin-top: 1800px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="cat">
  <h4><a href="#" class="disabled" style="color:#737373; text-decoration:none">Вопрос?</a></h4>
  <p style="margin-top:10px;">
    <em>Ответ</em>
  </p>
</div>

5
  • попробовал, перестала отображаться страница. 26 ноя 2017 в 19:40
  • @ВасилийПупкин где перестала? я в своем примере специально границу дива сделал 1800 пикселей, чтобы прокрутку получить, это пример для показа работающего скрипта. По клику на ссылке вверх прокрутка не идет. 26 ноя 2017 в 19:41
  • После того как добавляю <style> #cat { margin-top: 1800px; } </style> перестает работать, на странице вообще пусто 26 ноя 2017 в 19:43
  • всё равно кидает вверх... 26 ноя 2017 в 19:44
  • @ВасилийПупкин, ответ заключается в preventDefault, не нужно копировать себе всё остальное.
    – vp_arth
    26 ноя 2017 в 19:44

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.