トッカンソフトウェア

JavaScript 画面遷移

今回は画面遷移をやります。


ソース

				
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScriptのテストページ</title>
<meta http-equiv="refresh" content="10;URL=test2.html">
</head>
<body>
	<a href="test2.html">リンク1</a>
	<input type="button" id="id1" value="リンク2" />
	<input type="button" id="id2" value="リンク3" />
	<input type="button" id="id3" value="新画面" />
	<form method="POST" action="./test2.html" name="name0" id="id0">
		<input type="submit" id="id4" value="Submit" />
	</form>
</body>
<script type="text/javascript">

	document.getElementById( "id1" ).onclick = function(){
		document.location = "test2.html";
	};
	document.getElementById( "id2" ).onclick = function(){
		document.location.href = "test2.html";
	};
	document.getElementById( "id3" ).onclick = function(){
		window.open("test2.html");
	};

</script>
</html>


			

metaタグによる画面遷移

metaタグで http-equiv="refresh" を指定すると指定時間後に指定ページに画面遷移します。

時間とページは content で指定します。content="秒数;URL=遷移先URL" となります。


aタグのhref属性による画面遷移

aタグのhref属性にURLを貼る画面遷移です。aタグで囲んだ部分をクリックすると画面遷移します。aタグで画像を囲むと画像クリックで画面遷移します。


submitボタンでFormに指定したURLに画面遷移

submitボタンが押されたり、submit()関数が実行されるとFormで指定したURLを実行します。通常はPOSTを指定しますが、GETも指定できます。


document.location(.href)で画面遷移

document.location または document.location.href でURLを指定して画面遷移します。


window.openで画面遷移

window.open でURLを指定すると新しい画面で表示されます。。


ページのトップへ戻る