Change variable value in js from HTML JavaScript?

Question

I need the community to help me with the following:

I defined the variable x=1 in my js file. I have 2 HTML files that use that variable (1.html and 2.html). I want to use onclick event in 1.html to change the value of variable x to 2 permanently.. so that if I use x variable in 2.html it's value is 2 not 1.

This is what I have in java.js file:

x=1;

This is in 1.html:

<html>
    <head>
        <script type="text/javascript" src="java.js">
        </script>
    </head>
    <body>
        <input type="button" value="Change x" onClick="x=4">
            <p id="iz"></p>
    </body>
</html>

This is in 2.html:

<html>
    <head>
        <script type="text/javascript" src="java.js">
        </script>
    </head>
    <body>
        <input type="button" value="Change x" onClick="x=x+1">
            <p id="iz"></p>
    </body>
</html>

The result of the button in 2.html should be 5.

The only way to do this would be to pass the values from page to page, which is best done using sessions when x is changed in one page, so that it can be persisted between pages. You could also use local storage or cookies and load 'x' from those values if present and fallback to its value of '1' if it's not present. — MyStream
– MyStream, Commented Mar 1, 2012 at 22:27
Can you please example the code that I can use to persist the value between pages? I am using a frameset with 2 cols.. meaning I always have 2 html files open. If this makes things easier to understand I shall go into detail: I am trying to realise a game. For this my index is split in two frames, 1 being the map where you can click on buildings, the other being used for building properties and actions. Any suggestions? — Vantalk
– Vantalk, Commented Mar 2, 2012 at 22:40
I'd suggest, for now, then, learning specifically about cookies (perhaps using this: code.google.com/p/cookies) as a first-step. — MyStream
– MyStream, Commented Mar 2, 2012 at 22:47

zzzzBov · Accepted Answer · 2012-03-01 22:27:05Z

2

JavaScript doesn't work like that. There's no persistence between pages without using cookies, or passing the state to the server.

If you navigate to foo.html and it sets var foo = 1 and then navigate to bar.html, foo will not have been set.

answered Mar 1, 2012 at 22:27

zzzzBov

180k57 gold badges328 silver badges375 bronze badges

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

Comments

Alex · Accepted Answer · 2012-03-01 22:27:40Z

0

Short answer, you can't only using JavaScript - the web is stateless.

Though, can use a cookie or local storage as your backing store to hold the value. Initially setting it to 1, any subsequent modifications effect the backing store and reflect the proper value.

answered Mar 1, 2012 at 22:27

Alex

35.5k5 gold badges81 silver badges94 bronze badges

Comments

Mario Corchero · Accepted Answer · 2012-03-01 22:28:51Z

0

In java script there is no persistence of variable as you want, you have to use cookies, a server side aproach or the local storaged offered in html5

answered Mar 1, 2012 at 22:28

Mario Corchero

5,6256 gold badges40 silver badges62 bronze badges

Comments

BumbleB2na · Accepted Answer · 2012-03-01 22:30:39Z

0

This is not normal behaviour for JavaScript because the values you set will on persist for the duration of either page. What you probably want to do is store the value of x on a server, store it in a cookie, or store it in localStorage.

answered Mar 1, 2012 at 22:30

BumbleB2na

10.8k6 gold badges30 silver badges31 bronze badges

Comments

Bot · Accepted Answer · 2012-03-01 22:31:45Z

0

In each of your pages it is pulling in x=1. Just because you change a variable on one page doesn't mean it is going to be seen on another page. This is where you need to pass variables along to the other pages with either GET or POST or cookies or local storage

answered Mar 1, 2012 at 22:31

Bot

11.9k11 gold badges78 silver badges134 bronze badges

1 Comment

Vantalk Over a year ago

I will try this first as I do not yet know how to use cookies.

thejartender · Accepted Answer · 2012-06-21 08:01:49Z

0

Your input tags are not closed, that can't be right. Fix these before looking for other reasons for bugs in your code:

<input type="button" value="Change x" onClick="x=4">

Should perhaps be:

<input type="button" value="Change x" onClick="x=4"/>

answered Jun 21, 2012 at 8:01

thejartender

9,3756 gold badges38 silver badges51 bronze badges

Collectives™ on Stack Overflow

Change variable value in js from HTML JavaScript?

6 Answers 6

Comments

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related