このようなjsコードをangus.jsで共有しました
var g_colour;
function getcolour() {
return g_colour;
}
function setcolour(colour) {
g_colour = colour;
}
次のような html ページ 1 と 2 によってアクセスされます。
1.html:
<html>
<head>
<title>Global javascript example</title>
</head>
<body>
<a href="2.html">Page2</a>
<script src="angus.js"></script>
<form name="frm">
<input type="button" value="Setblue" onclick="setcolour('blue');" />
<input type="button" value="Setyellow" onclick="setcolour('yellow');" />
<input type="button" value="getcolour" onclick="alert(getcolour());" />
</form>
</body>
</html>
2.html:
<html>
<head>
<title>Global javascript example page 2</title>
</head>
<body>
<a href="1.html">Page1</a>
<script src="angus.js"></script>
<form name="frm">
<input type="button" value="Setblue" onclick="setcolour('blue');" />
<input type="button" value="Setyellow" onclick="setcolour('yellow');" />
<input type="button" value="getcolour" onclick="alert(getcolour());" />
</form>
</body>
</html>
あるページで色を設定してページ 2 に移動し、その色にアクセスすると、undefined が返されます。つまり、g_colour の新しいインスタンスが、新しい html ページのロード時に作成されるようです。
ページ 1 で設定し、ページ 2 でアクセスできる一種のトップレベル変数にアクセスできるようにしたいのですが、Javascript でそれを行うにはどうすればよいですか?