プログラミング学習の記録 130.1 JavaScript 2 Webアプリケーションの基礎とJavaScriptを使ったプログラミングテクニック (CD-ROM付) (プログラミング学習シリーズ)の練習問題4.2

開発環境:Microsoft Visual Web Developer+Internet Explorer

"JavaScript 2 Webアプリケーションの基礎とJavaScriptを使ったプログラミングテクニック (CD-ROM付) (プログラミング学習シリーズ)"のp.101の練習問題4.2を解いてみる。

4.2

<!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>Ajax Request</title>
    
    <script type="text/javascript" src="../prototype.js"></script>
    <script language="javascript" type="text/javascript">
        function replaceText() {
            p1 = document.getElementsByTagName("p")[1];
            new Ajax.Updater("h1", "HaveaScript.txt", { method: "get",
                onComplete: Complete, onLoading: Loading, onLoaded: Loaded,
                onSuccess: Success, onFailure: Failure
            });
        }
        function Complete() {
            var label = document.createElement("p");
            var text = document.createTextNode("通信完了");
            label.appendChild(text);
            p1.appendChild(label);
        }
        function Loading() {
            var label = document.createElement("p");
            var text = document.createTextNode("読み込みを開始");
            label.appendChild(text);
            p1.appendChild(label);
        }
        function Loaded() {
            var label = document.createElement("p");
            var text = document.createTextNode("読み込みを終了");
            label.appendChild(text);
            p1.appendChild(label);
        }
        function Success() {
            var label = document.createElement("p");
            var text = document.createTextNode("通信成功");
            label.appendChild(text);
            p1.appendChild(label);
        }
        function Failure() {
            var label = document.createElement("p");
            var text = document.createTextNode("通信失敗");
            label.appendChild(text);
            p1.appendChild(label);
        }</script>
</head>
<body>
    <h1 id="h1">Ajax.Request</h1>
    <p>クリックすると見出しが変わります。</p>
    <input type="button" value="Click!" onclick="replaceText();" />
    <p>通信状態</p>
</body>
</html>

保管場所: Ajax Request

Kamimura's blog

2010年3月14日日曜日

プログラミング学習の記録 130.1 JavaScript 2 Webアプリケーションの基礎とJavaScriptを使ったプログラミングテクニック (CD-ROM付) (プログラミング学習シリーズ)の練習問題4.2

0 コメント:

コメントを投稿