Access the value of another function after window.location in JavaScript

Question

So here is my content.js file.

var title
function content(e) {
    title = e.getAttribute('title');
    // alert(title); //it alerts the title 
    window.document.location="movie";
}

function setcontent(){
    document.getElementById("name").innerHTML = title; //undefined
}

The content(e) function is called by recommend.html and after it redirects to the page movie.html, setcontent() function will be called by the movie.html.

Here is my movie.html

<html>
<head>
    <title>Movie Page</title>
    <script type="text/javascript" src="{{url_for('static', filename='content.js')}}"></script>
</head>

<body onload="setcontent()">
    <center>
        <div id="name"></div>
    </center>
</body>

But once the browser redirects to movie.html, it shows undefined in the place of id name instead of the title value. I'm not sure what went wrong. Can somebody help me with this?

To hold data on page change you need to either pass it via a query string or use localStorage (I would recommend that). — Paul
– Paul, Commented Jun 13, 2020 at 12:31

Olian04 · Accepted Answer · 2020-06-13 12:33:56Z

1

If you want to store data between page loads, then you need to store it in the browsers "localStorage" (or "sessionStorage"). Like this:

function content(e) {
  localStorage.setItem('title', e.getAttribute('title'));
  window.document.location="movie";
}

function setcontent(){
    document.getElementById("name").innerHTML = localStorage.getItem('title');
}

answered Jun 13, 2020 at 12:33

Olian04

6,9002 gold badges31 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Akshay Bande · Accepted Answer · 2020-06-13 12:33:23Z

0

When you redirect, window object will belong to new window. Your previous window's variables won't be available in new window.

You can achieve your use case by:

var title
function content(e) {
    title = e.getAttribute('title');
    // alert(title); //it alerts the title
    window.document.location=`movie?name=${title}`;
}

function setcontent(){
    document.getElementById("name").innerHTML = window.location.search.split("=")[1];;
}

answered Jun 13, 2020 at 12:33

Akshay Bande

2,6052 gold badges17 silver badges34 bronze badges

Comments

Quentin · Accepted Answer · 2020-06-13 12:33:29Z

0

A JavaScript program (in the context of a <script> element) runs inside a web page.

If you navigate to a new webpage then you are effectively quitting that program and running a new one.

Variables don't have a life-span longer than the program they are part of.

If you want data from one page to be available in another then the first page needs to put it somewhere that the second page can access.

Such places include:

the URL
local storage
a cookie

answered Jun 13, 2020 at 12:33

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Collectives™ on Stack Overflow

Access the value of another function after window.location in JavaScript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related