AJAXのお勉強

XMLHttpRequest＠AJAX

AJAXの基本であるXMLHttpRequestです。
XMLHttpRequestは、ブラウザの種類により生成方法が違います。
IE6以下では、ActiveXObjectを利用します。

以下は、ファイルの中身をアラートとして表示を行っています。
XMLHttpRequestを生成します。
openメソッドを用いて、リクエストを送信します。
onreadystatechangeにて、アラート処理を行います。


<html>
<head>
<title>Ajax XMLHttpRequest</title>
<script type="text/javascript">
<!--

function requestFile(fileName) {
    var xmlHttpReq = createHttpRequest()

    xmlHttpReq.open('GET', fileName ,true)

    xmlHttpReq.onreadystatechange = function() {

        if (xmlHttpReq.readyState==4) {
            alert(xmlHttpReq.responseText)
        }
    }

    xmlHttpReq.send(null)
}

function createHttpRequest() {
    var x = null;

    //IE7,Firefox, Safari
    if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    }

    //IE6
    try {
        return new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
    // IE5
        try {
            return new ActiveXObject("Microsoft.XMLHTTP");
        } catch(e) {
            x = null;
        }
    }
    return x;
}

// -->
</script>
</head>
<body>
<input id="Button" type="button" value="　実行　" onclick="javascript:requestFile('./test.txt')">
</body>
</html>

Copyright (C) 2008 AJAXのお勉強. All Rights Reserved.