I have two html files: log_in.html and edit_story_name.html and two javascript files log_in.js and edit_story_name.js.
I initialized an object variable in log_in.js.
log_in.js
var User_Name= {value: "default_value"};
var Login_Password;
$(document).ready( function(){
$(' #public_User ').click( function(){
$(' #log_in_account_txt ').val('publicUser');
$(' #log_in_psw ').val('publicUser');
User_Name.value= "publicUser";
alert("User_Name.value is"+ User_Name.value);
window.open('edit_story_name.html','newwindow');
});
});
As the user presses the button “public_User”, it will assign object variable’s value to be “pulicUser”.
Then the window “edit_story_name.html” will be opened.
edit_story_name.html:
<!DOCTYPE>
<html>
<head>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery-1.7.2.js"></s ript>
<script type="text/javascript" src="log_in.js"></script>
<script type="text/javascript" src="edit_story_name.js"></script>
<link type="text/css" href="edit_story_name.css" rel="Stylesheet"/>
</head>
<body>
<input id="input_story_name" type="text" value="">
</body>
</html>
edit_story_name.js:
window.addEventListener( "load",function(){
alert("User_Name.value is"+ User_Name.value);
if(User_Name.value == "publicUser"){
Story_Name="_story";
}else {
Story_Name= User_Name.value +"_story";
}
$(' #input_story_name').val(Story_Name);
});
Basically, after I press the button “public_User” in log_in.js, the User_Name’s value should change to be “publicUser”.
But no matter how hard I tried, the value remains: “default_value”.
Please help.
Javascript variables last only for the lifetime of a single web page. In addition, each browser window has it’s own separate state. When you go to another web page in the same window, your javascript scripts are reinitialized again from scratch and contain none of the values from the previous page.
Common methods for saving some state from one page that you can use in other pages are: