аватар |

Статьи / JavaScript /

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

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

Код HTML и JS

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

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


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


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

Код HTML и JS

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

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


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

Код HTML и JS

<a onclick="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 onclick="javascript:location.reload(); return false;">Обновить</a>
<a onclick="javascript:history.go(1); return false;">Вперёд</a>
<a onclick="javascript:history.back(); return false;">Назад</a>
<a onclick="javascript:history.forward(); return false;">Вперёд</a>


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



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


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