skip to Main Content

I have two html pages, each with a js file.

When I click on a button on page 1, it should change a variable param to true and redirect the user to page 2.

In page 2 I have to check if param = true and then continue my script.

  • page1.html
<div class="container-fluid" id="about">
  <div class="row">
    <div id="mainsubtitle">Page 1</div>
    <button id="edit" type="button">Go to page 2</button>
  </div>
</div>
  • script1.js
var param = false;

edit.addEventListener("click", switchToOpenSession);
...
function switchToOpenSession() {
    param = true;
    ...
}
  • page2.html
<div class="container-fluid">
  <div class="row">
    <div>Page 2</div>
    <button id="create" type="button">Create account</button>
  </div>
</div>
  • script2.js
if (param)
   /* do this */

I tried export/import param but I got Unexpected token 'export' error. I tried type="module" but it doesn’t work. The samples that I found was two js files in the same html page!

Can someone help please?

3

Answers


  1. you can export the variable from first file

    var first;
    
    export { first }
    

    and in your second file you can import that variable

    import { first} from './first.js'
    

    OR

    <script type="module" src='first.js'></script>
    
    Login or Signup to reply.
  2. You can’t share variable states like that. These two pages are totally different instances, so the context is not the same.

    Option 1. When you redirect from one page to another you can add URL param and parse it on page 2.

    Option 2. Use localStorage. I assume you have the same origin while talking on page 1 and page 2 so the stored data will be visible.

    Login or Signup to reply.
  3. you cannot access variable from different page, except you load page2.html using ajax. Alternative way using cookie or localStorage

    script1.js

    var param = false;
    
    edit.addEventListener("click", switchToOpenSession);
    ...
    function switchToOpenSession() {
        param = true;
        localStorage.setItem('param', true)
        ...
    }
    

    then in script2.js

    if (localStorage.getItem('param') == 'true') // note the quotes
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search