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从左侧的菜单中选择一个选项。或者摆脱外部$(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 回答