0

私は JavaScript が初めてで、Ajax を使って HTML を<div>要素に動的にロードしようとしています。に挿入する必要がある HTML を含む JSON を吐き出す PHP ページがあります<div>。私はテストを行っていますが、通話を機能させることができません。ReadyState でアラートを出し始めたところ、0 が表示され、それ以外は何も表示されませんでした。私の理解ではsendData()、readystate が変化するたびに関数を呼び出す必要がありますが、1 回しか実行しないように見えるか、readystate が変化しないため、1 回しか呼び出されません...?

これは私のPHPです

<?php
    $array['html'] = '<p>hello, menu here</p>';
    header('Content-type: application/json');
    echo json_encode($array);
?>

これは私のHTMLです

<!DOCTYPE html>
<html>
<head>
<title>Veolia Water - Solutions and Technologies Dashboard</title>  
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />    
<meta name="description" content="Veolia Water - Dashboard"/>
<meta http-equiv="imagetoolbar" content="no" />
<meta author="Nathan Sizemore"/>
<link rel="stylesheet" href="./css/stylo.css" media="screen"/>
</head>
<body>
    <div id="menu">
    </div>
    <div id="content">
    </div>
</body>
<script src="./js/dashboard.js"></script>
</html>

これは私のJavaScriptです

var request;
window.onload = function() 
{
     load_menu();
}

//Load menu function
function load_menu()
{   
    request = getHTTPObject();
    alert(request.readyState);
    request.onreadystatechange = sendData();
    request.open("GET", "./php/menu.php", true);
    request.send(null);
}

function getHTTPObject()
{
    var xhr = false;
    if (window.XMLHttpRequest)
    {
        xhr = new XMLHttpRequest();
    } 
    else if (window.ActiveXObject) 
    {
        try
        {
            xhr = new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch(e)
        {
            try
            {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e)
            {
                xhr = false;
            }
        }
    }
    return xhr;
}

function sendData()
{
    alert(request.readyState);
    // if request object received response
    if (request.readyState == 4)
    {
        var json = JSON.parse(request.responseText);
        document.getElementById('menu').innerHTML = json.html;
        alert(json.html);
    }
}

助けてくれてありがとう！

ネイサン

4

3 に答える 3

2

これを使って：

request.onreadystatechange = sendData;

()から削除されることに注意してくださいsendData()

以前は、すぐに実行sendDataしてその結果を に返すというものでしたonreadystatechange。実際には何もreturn編集されていないため、値はundefined. 実際には何も設定していないため、変更onreadystatechange時に実際には何も実行されませんでした。stateプロパティは関数へのonreadystatechange参照を期待しています...これはまさにそれsendDataです。

あなたのコードでは、sendData(誤って) 1 回実行されたため、報告された状態は 0 (XHR の初期状態) です。

于 2013-04-05T20:42:56.477 に答える
1 
request.onreadystatechange = sendData();

する必要があります

request.onreadystatechange = sendData;

関数自体を使用するのではなく、sendDataすぐに呼び出して、その関数の結果をリスナーとして使用しています。

于 2013-04-05T20:43:41.117 に答える
1

この行を変更

request.onreadystatechange = sendData();

これに

request.onreadystatechange = sendData;

最初のコードはsendData、ハンドラーとして結果を呼び出して割り当てます。
2 つ目は、関数自体を割り当てます。

于 2013-04-05T20:43:02.640 に答える