аватар Автор: Сергей Касаткин | 02 апреля 2014 11:56

Статьи / JavaScript /

Как сделать кнопку назад или как вернуться на предыдущую страницу? HTML и JS

Как сделать кнопку назад или как вернуться на предыдущую страницу средствами HTML и JS? В данной статье мы рассмотрим многие решения и примеры с функцией history в js.

Код HTML и JS

<!-- вариант с кнопкой -->
<input type="button" onclick="history.back();" value="Назад"/>

<!-- вариант ссылкой -->
<a href="javascript:history.back();">Назад</a>


Как сделать кнопку, которая вернёт на 2 и более страниц назад?


У функции back есть значение. Например, указав, '-2' - пользователь возвращается на 2 страницы назад. Смотрим пример:

Код HTML и JS

<!-- вариант с кнопкой -->
<input type="button" onclick="history.back(-2);" value="Назад"/>

<!-- вариант ссылкой -->
<a href="javascript:history.back(-2);">Назад</a>


И да - ссылкой может быть и изображение, и блок и тд.

Код HTML и JS

<a href="javascript:history.back();return false;">
     <img src="image.png" alt="Картинка"/>
</a>


Как автоматически переслать пользователя назад? JS


Для этого достаточно перед закрывающим head написать

Код HTML и JS

...
<script>history.go(-1)</script>
</head>


Другие функции с history в js


Обновить, назад, вперёд.

Код HTML и JS

<a href="javascript:location.reload();">Обновить</a>
<a href="javascript:history.go(1);">Вперёд</a>
<a href="javascript:history.back()">Назад</a>
<a href="javascript:history.forward()">Вперёд</a>


Спасибо за внимание! Вопрос частый! Надеюсь многим поможет!)
 



Похожие статьи


Комментарии к статье (vk.com)