javascript open new html with variable

Question

I want to go to "stats.html" with pressing this button and i want to write the var name on "stats.html" code on first site:

<html>
    <head>
    </head>
    <body>
        <script type="text/javascript">  
            function getcube(){  
                var number=document.getElementById("field").value;  
            }  
            function window() {
                var number=document.getElementById("field").value;
            }
        </script>
        <form action="stats.html">
            <input id="field" type="text" name="name" placeholder="Player Name...">
            <input id="button" type="submit" value="SEARCH" onclick="window()">
        </form>
    </body>
</html>

I don't know what i should include in the "stats.html".

Thanks for help.

Possible duplicate of [Persist variables between page loads](https://stackoverflow.com/questions/29986657/persist-variables-between-page-loads) — , Mar 11 '19 at 10:28
While this is possible with just JS, you're essentially cargo cult programming. Learn PHP and do this properly. — , Mar 11 '19 at 10:29
Beside PHP there are plenty of other server side languages/frameworks you can use. Including ones that work with javascript. — Mark Baijens, Mar 11 '19 at 10:31
`window` is a reserved word, don't use it as name of a function — R3tep, Mar 11 '19 at 10:33

score 0 · Accepted Answer · answered Mar 11 '19 at 10:43

One way to do this would be to use query parameters.

// index.html
<script type="text/javascript">  
  function redirect() {
    const name = document.getElementById("name").value;
    location.href = `stats.html?name=${name}`;
  }
</script>

<input id="name" type="text" name="name" placeholder="Player Name...">
<input id="button" value="Go!" onclick="redirect()">

// stats.html
<script type="text/javascript"> 
  const urlParams = new URLSearchParams(window.location.search);
  const name = urlParams.get('name');
  document.getElementById("name").value = name;
</script>

<input id="name" type="text" name="name" placeholder="Player Name...">

More info: How can I get query string values in JavaScript

score 0 · Answer 2 · answered Mar 11 '19 at 10:46

For redirecting to state.html you could use window.location.replace(url). For example:

window.location.replace(http://example.com/state.html)

If you want to simulate someone clicking on a link, use location.href

If you want to simulate an HTTP redirect, use location.replace

There is some different ways for passing the value of your variable to next page. Before that you should know that HTML / HTTP is stateless. This means, what you did / saw on the previous page is disconnected with what you do / see on the current page.

This additional information might be helpful too:

How to pass javascript object from one page to other

additional information about "Client storage solution"

What is the difference between localStorage, sessionStorage, session and cookies?

Good luck!

javascript open new html with variable

2 Answers2