A Web Design Community curated by Chris Coyier

Code Snippets Gallery

Code Snippets > JavaScript > “Go Back” Button Submit one!

“Go Back” Button

Browsers already have “back” buttons, so you’d better have a darn good reason for needing to put one on your page!

Input button with inline JavaScript

<input type="button" value="Go Back From Whence You Came!" onclick="history.back(-1)" />

This is totally obtrusive, but you could fix that by only appending this button through JavaScript.

PHP

If JavaScript isn’t a possibility, you could use the HTTP_REFERER, sanitize it, and echo it out via PHP.

<?php
  $url = htmlspecialchars($_SERVER['HTTP_REFERER']);
  echo "<a href='$url'>back</a>";
?>

Reference URL

2 Responses

  1. Al Toman says:

    1. Many users aren’t aware of their browser back button.
    2. Users filling forms often make errors. Therefore, they complete the form, it goes through edit checks on the server, then it displays their input and asks if it is correct. If not, they need to return to correct it. A return button, front-and-center, becomes applicable.
    3. The browser back button and the scripted back button do not always behave in the same manner. If you’re looking for a specific behavior, then, it needs to be created.

  2. Al Toman says:

    Oh. The javascript:history.go(-1) and its derivatives returns an Expired Page in IE8

Leave a Comment

Remember:
  • Be nice.
  • Wrap multiline code in <pre> and <code> tags and escape it first (turn <'s into &lt;'s).
  • You may use regular HTML stuff like <a href="">, <em>, and <strong>
* This website may or may not contain any actual CSS or Tricks.