コンテンツ更新
コンテンツ更新
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8" />
<title>コンテンツ更新</title>
<script src="../js/prototype.js" type="text/Javascript"></script>
<script src="../js/test6.js" type="text/Javascript"></script>
</head>
<body>
<form>
<input type="button" id=dispAnotherImage value="別の画像を表示する" /><br />
<div id="imagePlace" class="standard">
<img src="1.jpg">
</div>
</form>
</body>
</html>
<!--
------------------------------------------------------------------------
test6.js
//画面を実行すると呼び出さされます
Event.observe(window, 'load', dispImage);
//ボタンの動作を定義しています
function dispImage(){
Event.observe(
'dispAnotherImage',
'click',
//無名関数でユーザに通知およびタイマーを使い別のページを呼び出します
function()
{
$("imagePlace").innerHTML = "拡大しています･･･";
//このサンプルでは1秒後に別のページを呼び出しています
setTimeout( recieveImageData, 1000 );
}
);
}
function recieveImageData(){
//呼び出すURLを指定します
new Ajax.Request('test6_2.html',
{
method : 'get',
onSuccess : function(httpObject)
{
$("imagePlace").innerHTML = httpObject.responseText;
}
}
);
}
test6_2.html
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8" />
</head>
<body>
<form>
<img src="2.jpg"/>
</form>
</body>
</html>
------------------------------------------------------------------------
-->
|
|