0

私は JavaScript と AJAX の初心者です。

select 要素の状態が変化したときに、AJAX を使用して HTML テーブル要素 (div に含まれる) を更新する JavaScript コードがあります。その部分は完璧に機能します。

一方、不透明度のアニメーションを更新して機能させることができません。Chrome の JavaScript コンソールには次のように表示されます。

キャッチされていない TypeError: 未定義のプロパティ 'style' を読み取れません

JavaScript コードの 2 行目。

これが私のJavaScriptコードです:

function fadeIn(objectToFade) {
    objectToFade.style.opacity = parseFloat(objectToFade.style.opacity) + 0.1;

    if ( objectToFade.style.opacity < 1 ) {
        setTimeout(function() { fadeIn(objectToFade); }, 50);
    }
}

function fadeOut(objectToFade) {
    objectToFade.style.opacity = parseFloat(objectToFade.style.opacity) - 0.1;

    if ( objectToFade.style.opacity > 0.2 ) {
        setTimeout(function() { fadeOut(objectToFade); }, 50);
    }
}

function changeClient(client) {

    var clientTableDiv = document.getElementById("clientTable");
    var xmlhttp = new XMLHttpRequest();

    fadeOut(document.getElementById("MetricsStatsByClient"));

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            clientTableDiv.innerHTML = xmlhttp.responseText;
            fadeIn(document.getElementById("MetricsStatsByClient"));
        }
    }

    xmlhttp.open("GET","functions.php?fct=cc&client=" + client, true);
    xmlhttp.send();
}

「スタイル」プロパティが認識されていないようです。私は何を間違っていますか？

ありがとう！

編集1

再帰呼び出しのパラメーターを修正した後、changeClient 関数でこれを実行しているときに NaN (Not a Number) を取得します。

alert(parseFloat(document.getElementById("MetricsStatsByClient").style.opacity));
4

2 に答える 2

4

オブジェクト参照を渡していないためobjectToFade、未定義です。

setTimeout(fadeIn, 50);

だからあなたはそれを渡す必要があります

setTimeout(function() { fadeIn(objectToFade); }, 50);

あなたのことも同じですfadeOut。

于 2013-05-17T15:12:48.647 に答える
2

fadeOut呼び出しに/fadeInを渡す場合setTimeout、必要な要素パラメーターを指定しません。

if ( objectToFade.style.opacity < 1 ) {
    setTimeout(function () {
        fadeIn(objectToFade);
    }, 50);
}
于 2013-05-17T15:13:52.480 に答える