0

だから私はこのコードを持っています：http：//jsfiddle.net/7rGSb/1/

var volumeDiv = document.getElementById("volumeNumber");
var volumeOld = 8;
var volumeNew = 37;
var timeNew = (1000 / (volumeNew - volumeOld));
changeVolume();

function changeVolume() {
    volumeDiv.innerHTML = volumeOld;
    volumeOld++;
    if (volumeOld <= volumeNew) setTimeout(changeVolume, timeNew);
};​

1秒で8から37になる文字列です。正常に動作しています。

ただし、クリックイベントハンドラー（ http://jsfiddle.net/wH2qF/1/）に入れようとすると、機能しなくなります。

$(function() {
    $("#Volume").click(function() {

        setTimeout(triggerVolumeChange, 4000);

        function triggerVolumeChange() {

            var volumeDiv = document.getElementById("volumeNumber");
            var volumeOld = 8;
            var volumeNew = 37;
            var timeNew = (1000 / (volumeNew - volumeOld));
            changeVolume();

            function changeVolume() {
                volumeDiv.innerHTML = volumeOld;
                volumeOld++;
                if (volumeOld <= volumeNew) setTimeout(changeVolume, timeNew);
            };

        };

    });
});​

なぜですか？

changeVolume();別の関数内で呼び出しているからですか？もしそうなら、どうすればその関数を呼び出さずに機能させることができますか？

4

2 に答える 2

4

選択しましMooToolsたが、jQuery.ready()とDOM選択構文を使用しているようです。

jQuery左側のメニューからオプションの1つを選択します。または、外側を取り除き$(function() {...});、選択/ハンドラーコードを更新します。

于 2012-12-14T23:12:57.293 に答える
1

このシナリオで必要とされないのに、なぜ入れ子関数があるのですか。

関数宣言を外部に移動します

$(function() {
    $("#Volume").click(function() {
        setTimeout(triggerVolumeChange, 4000);
    });
});

var volumeDiv = document.getElementById("volumeNumber");
var volumeOld = 8;
var volumeNew = 37;
var timeNew ;

function triggerVolumeChange() {
    timeNew = (1000 / (volumeNew - volumeOld));
    changeVolume();
};

function changeVolume() {
    volumeDiv.innerHTML = volumeOld;
    volumeOld++;
    if (volumeOld <= volumeNew) 
        setTimeout(changeVolume, timeNew);
};​

また、フレームワークがjQueryに設定されていることを確認してください。

フィドルをチェック

于 2012-12-14T23:16:27.610 に答える