72

I am trying to do a very simple task here, I would like to be able to click a button on a page and have it take me to another page. I have tried window.location.href, and a bunch of other things and it does nothing. I have tried different platforms and different browsers, all with the same result.

I know that it can call a function but I just cannot get the new page to load. Also this is all in my local file system and both pages live at the same level (but I have also tried to load an external page like www.apple.com).

Any thoughts?

Thanks Patrick

2
  • 1
    You need to be more specific than "a bunch of other things." Post your code (HTML and JavaScript) and tell us what errors you're getting. Commented Sep 10, 2010 at 7:12
  • Not a good idea: A button is experienced by the user as something that causes action/trigger (postback, save/load). A Link (a href) is jused for navigation. Do not mix those. You'll confuse users. Commented Sep 10, 2010 at 7:46

4 Answers 4

102

Simple code to redirect page

<!-- html button designing and calling the event in javascript -->
<input id="btntest" type="button" value="Check" 
       onclick="window.location.href = 'http://www.google.com'" />
Sign up to request clarification or add additional context in comments.

2 Comments

This one worked, however I think that my issue was that I had type="submit" and not type="button". Thanks for the help!
window.location.assign() worked better for me in firefox. For some reason assignment = messed history.
24

Don't abuse form elements where <a> elements will suffice.

<style>
    /* or put this in your stylesheet */

    .button {
        display: inline-block;
        padding: 3px 5px;
        border: 1px solid #000;
        background: #eee;
    }

</style>

<!-- instead of abusing a button or input element -->
<a href="url" class="button">text</a>

2 Comments

I was also thinking of going this way. Thank you for the help. I enjoy these buttons more anyway. Thanks again.
I tried this button and it doesn't look good. It is just a link with a black line around it.
20

Just window.location = "http://wherever.you.wanna.go.com/", or, for local links, window.location = "my_relative_link.html".

You can try it by typing it into your address bar as well, e.g. javascript: window.location = "http://www.google.com/".

Also note that the protocol part of the URL (http://) is not optional for absolute links; omitting it will make javascript assume a relative link.

1 Comment

Thanks for the suggestion, I didn't know you could run javascript in the browser, learn something new every day. I was trying the window.location and others like it but couldn't get it to work, and I knew that it should. I found that my "type" was wrong so it had nothing to do with the JavaScript and everything to do with the HTML. Thanks again for the advice.
6

The answers here work to open the page in the same browser window/tab.

However, I wanted the page to open in a new window/tab when they click a button. (tab/window decision depends on the user's browser setting)

So here is how it worked to open the page in new tab/window:

<button type="button" onclick="window.open('http://www.example.com/', '_blank');">View Example Page</button>

It doesn't have to be a button, you can use anywhere. Notice the _blank that is used to open in new tab/window.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.