window.location Does not work in javascript

Question

This code below for some reason doesn't work when trying to redirect. I have tried several other ways such as window.location.href and more. The only thing that works is window.open ("") but this opens a page in a new window when I need it to be on the same. If I do window.open("", "_self") then it does not work again. If I replace the window.location with an alert it works fine, so I think the overall code is normal just something preventing it from redirecting on the same page. This issue is also on my Windows Chrome and a Mac Firefox.

<html>
    <head>
        <script type="text/javascript">
            function checkAnswers(){    
                getElementById("myQuiz");
                if(myQuiz.elements[1].checked){
                    window.location = "www.google.com";
                }else{
                    alert("Failed");
                }
            };
        </script>
    </head>
    <body>
        <img src="Castle.JPG" />
        <form id="myQuiz" onsubmit="checkAnswers()" action="">
            <p>Name the country this castle is located in?
                <br/>
                <input type="radio" name="radiobutton" value="A"/>
                <label>England</label>
                <input type="radio" name="radiobutton" value="B"/>
                <label>Ireland</label>
                <input type="radio" name="radiobutton" value="C"/>
                <label>Spain</label>
                <input type="radio" name="radiobutton" value="D"/>
                <label>France</label>
                <input type="submit" name="submit" value="Submit"/>
                <input type="reset" name="reset" value="Reset"/>
            </p>
        </form>
    </body>
</html>

For starters, `getElementById( "myQuiz" );` should be `var myQuiz = document.getElementById("myQuiz");` — Tom Pietrosanti, May 18 '12 at 03:30
@jmort253 http://www.w3.org/TR/html4/interact/forms.html#h-17.4 — Derek 朕會功夫, May 18 '12 at 03:41
@Derek - You're referencing HTML4, which is superseded by HTML5, which is backwards compatible with HTML4, which kind of makes HTML4 sort of obsolete in my opinion except in some pretty extreme circumstances. Thus, if you're using an HTML5 doctype (which you should) then either method is considered valid. Additionally, here's a handy link: http://stackoverflow.com/questions/4893193/are-xhtml-self-closing-elements-still-valid-in-html5. My sites also validate with the self-closing tag. — jamesmortensen, May 18 '12 at 03:49
@jmort253 - Use [W3C's Validation Service](http://validator.w3.org/), choose HTML5: `(Invalid)` — Derek 朕會功夫, May 18 '12 at 03:51
@jmort253 - Oh, revalidated and it looks like it *is* valid in HTML5. — Derek 朕會功夫, May 18 '12 at 03:55
@Derek - That means that the element head is missing a required instance of the child element "title", which it is. Put a `` in the `` section and the error goes away. This has nothing to do with self-closing tags. — jamesmortensen, May 18 '12 at 03:55
@Derek - Cool :) Sorry to be picky. The main reason I dug into this as hard as I did is to check my own facts :) Thanks for reaffirming :) — jamesmortensen, May 18 '12 at 03:57
You can use self closing HTML like in XHTML in HTML5, but things like `
` will be interpreted as `
`, not `
` as in XHTML. The code looks (arguably) nicer and (arguably) more semantic, but it has no benefit beyond that. — william44isme, Jul 25 '13 at 12:56

score 16 · Answer 1 · edited May 18 '15 at 04:18

16

change js to:

function checkAnswers()
{
    var myQuiz=document.getElementById("myQuiz");
    if (myQuiz.elements[1].checked) {
        window.location.href = "http://www.google.com";
    }
    else {
        alert("Failed");
    }
    return false;
};

and change:

<form id="myQuiz" onsubmit="checkAnswers()" action="">

to

<form id="myQuiz" onsubmit="return checkAnswers();" action="">

edited May 18 '15 at 04:18

nobody

43
1
6

answered May 18 '12 at 03:36

artwl

3,502
6
38
53

Thanks! Adding the return is definitely what fixed it. I'm obviously very new to javascript, (like a few days new), so can you tell me why this worked? Thanks again. – George Kashouh May 18 '12 at 03:44
@GeorgeKashouh - You have to return, the value of the function `checkAnswers` has returned, to `onsubmit`. – Derek 朕會功夫 May 18 '12 at 03:47
To expand, when you return false in an onsubmit, the form doesn't submit. In other words, the page only redirects if the element is checked. – jamesmortensen May 18 '12 at 03:51

Ja͢ck · Answer 2 · 2012-05-18T03:45:25.453

7

When you change the location, you must give it an absolute URL:

location.href = '/some_page_on_my_site';

Or:

location.href = 'http://www.google.com';

Or:

location.href = '//www.google.com';

The last one will go to http or https, depending the current scheme. Thanks @Derek

edited May 18 '12 at 03:45

answered May 18 '12 at 03:31

Ja͢ck

170,779
38
263
309

score 3 · Answer 3 · answered Jul 06 '18 at 08:35

3

2018

multibrowser: safari, chrome, firefox:

just this work:

window.location.replace(url)

another options that tries assign url to window.location or window.location fails

answered Jul 06 '18 at 08:35

stackdave

6,655
9
37
56

score 2 · Answer 4 · answered May 18 '12 at 03:33

When you run this:

window.location ="www.google.com";

You're running this relative to the current requestURI. Thus, if you are on the http://example.com page, then you're attempting to redirect to:

http://example.com/www.google.com

Instead, just remember to include the protocol:

window.location ="http://www.google.com";

Remember, window.location is not your address bar, designed to deal with nontechnical people entering a web address in an address bar. With window.location, you must explicitly include http://.

score 1 · Answer 5 · answered May 18 '12 at 03:31

1

Your url used in window.location is local; you need to add in the http:// part of the url.

answered May 18 '12 at 03:31

Daedalus

7,586
5
36
61

score 1 · Answer 6 · answered May 18 '12 at 03:34

1

You forgot to assign myQuiz variable

var myQuiz = document.getElementById( "myQuiz" );

also you need to add http:// in the beginning of your url. Because, otherwise it is meant as relative url.

answered May 18 '12 at 03:34

Larry Foobar

11,092
15
56
89

score -1 · Answer 7 · answered Oct 16 '14 at 02:02

    <script type="text/javascript">
        function checkAnswers(){   

            var myQuiz = document.getElementById( "myQuiz" );
            if (myQuiz.elements[1].checked){ alert("123");
                window.location = "www.google.com";
            }else{
                alert("Failed");
            }
        };
    </script>
  </head>
<body>
    <img src="Castle.JPG" />
    <form id="myQuiz" onsubmit="return checkAnswers()" action="">
        <p>Name the country this castle is located in?
            <br/>
            <input type="radio" name="radiobutton" value="A"/>
            <label>England</label>
            <input type="radio" name="radiobutton" value="B"/>
            <label>Ireland</label>
            <input type="radio" name="radiobutton" value="C"/>
            <label>Spain</label>
            <input type="radio" name="radiobutton" value="D"/>
            <label>France</label>
            <input type="submit" name="submit" value="Submit"/>
            <input type="reset" name="reset" value="Reset"/>
        </p>
    </form>
</body>

FLoat · Answer 8 · 2016-06-09T12:28:47.453

the problem should be with calling a method without the respective object.. change the javascript to be as shown below... getElementById("myQuiz") is a method of the HTML document object.so when in javascript, to use this method you have to attach it to object with which its to act on. Remember getElementById() is not a javascript method. so when you do document.getElementById("myQuiz") you are tellin the javascript to go the document object(i.e HTML) run the method getElementById("myQuiz"). This method returns to JS an element. From DOM, all HTML elements are Objects.. So, we have an Obj_Form which is the element Object from HTML..

function checkAnswers(){    
     var Obj_Form=document.getElementById("myQuiz");
      if(Obj_Form.elements[1].checked){
          window.location = "http://www.google.com";
          }
      else{ alert("Failed");
        }
     }

window.location Does not work in javascript

8 Answers8