Кнопка назад на сайте

Кнопка назад на сайте

11 февраля 2020 HTML JavaScript

Как сделать кнопку назад на сайте? Самый простой вариант это с помощью JavaScript-функции history. С ней можно переходить вперед, назад, обновлять страницу и делать переход на две и более страницы сразу.

Кнопка назад

Как ссылка:

<a onclick="javascript:history.back(); return false;">Назад</a>

Как кнопка:

<input type="button" onclick="history.back();" value="Назад"/>

Функцию onclick="history.back();" можно применять не только к ссылкам и кнопкам, но и к любому элементу, например к картинке или блоку:

<img src="back.jpg" onclick="history.back();" /> 

Математика для всех i-maths.ru

Возвращение на несколько страниц назад

В скобках функции history.back можно указать количество страниц, которое необходимо для перехода. В примере ссылка возвращает пользователя на две страницы назад:

<a onclick="javascript:history.back(-2); return false;">Назад</a>

Обновить страницу

<a onclick="javascript:location.reload(); return false;">Обновить</a>

Перейти вперед

<a onclick="javascript:history.forward(); return false;">Вперёд</a>

или

<a onclick="javascript:history.go(1); return false;">Вперёд</a>

Если вам понравилась статья, вы можете отблагодарить автора любой суммой, какую сочтете для себя приемлемой:
Остались вопросы по статье? Задайте их прямо сейчас!
Версия сайта для слабовидящих на jQuery и плагин WordPress

Сегодня я расскажу как можно легко и совершенно бесплатно создать версию для слабовидящих практически для любого сайта. Это решение подойдет и для сайтов государственных организаций, так как полностью соответствует ГОСТ. Наша версия сайта для слабовидящих будет с удобным меню и Читать далее

jQuery data-* атрибуты

data-* атрибуты позволяют передавать некую скрытую информацию в элементах для её дальнейшего использования. Рассмотрим пример, когда на сайте есть список товаров и при нажатии кнопки "Купить", скрипту передавалось бы название и цена выбранного товара. <div id="157" class="product"> <div class="name">Системный блок</div> Читать далее

Закрепить блок при прокрутке

Возникла задача сделать прикрепление сайдбара, такое же, как в ВКонтакте. При скролле до верхней границы элемента он закрепляется, а при достижении определенного уровня останавливается и прокручивается до конца вместе со страницей. Раньше приходилось реализовывать подобное с нуля и это было Читать далее

Версия страницы для печати или печать отдельного блока на сайте

В этой статье рассмотрим как можно вызвать печать страницы с помощью JavaScript, распечатать отдельные блоки сайта и оформить распечатываемую страницу стилями. Вызвать печать на странице Печать документа на странице можно вызвать JavaScript функцией print(). Пример: <a href="javascript:(print());" class="button-print">Печать</a> Оформление страницы Читать далее

Кнопка наверх для сайта

Сегодня рассмотрим пример создания кнопки наверх с использованием библиотеки jQuery, которая появляется при скролле страницы и при нажатии на неё слистывает страницу на самый верх. Подключаем библиотеку jQuery <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> Код HTML <div class="scroll-up"></div> Код CSS <style> .scroll-up { position:fixed; Читать далее

Плавный якорь jQuery

Данный пример подойдет всем сайтам у которых есть якорные ссылки, особенно будет актуально для лендинг пейдж. При нажатии на ссылку, которая содержит якорь, происходит плавная прокрутка к элементу. Обычно якорная ссылка содержит в атрибуте href ID элемента назначения, со знаком Читать далее

Кнопка назад на сайте

Как сделать кнопку назад на сайте? Самый простой вариант это с помощью JavaScript-функции history. С ней можно переходить вперед, назад, обновлять страницу и делать переход на две и более страницы сразу. Кнопка назад Как ссылка: <a onclick="javascript:history.back(); return false;">Назад</a> Как Читать далее

3 комментария на «Кнопка назад на сайте»

  1. Никита:

    Все просто и понятно спасибо.

  2. Артём:

    Очень помогло, спасибо.

Добавить комментарий