0

我正在尝试使用 spin.js 创建一个函数。该函数加载微调器，然后如果使用它的参数再次调用它，则它会停止微调器。我无法正确获取变量范围。因此，当我调用该函数停止时，我在submitSpinner.

http://jsfiddle.net/atlchris/tQdZB/1/

function submitSpinner(stopSpinner) {
    var theSubmitSpinner;

    if (stopSpinner === true) {
        theSubmitSpinner.stop();

        $('#overlay').remove();
    }
    else {
        $('body').append('<div id="overlay"><div id="spinner"></div></div>');

        theSubmitSpinner = new Spinner({
            lines: 13,
            length: 15,
            width: 5,
            radius: 20,
            color: '#ffffff',
            speed: 1,
            trail: 60,
            shadow: false
        }).spin(document.getElementById("spinner"));
    }
}

submitSpinner();

$(function() {
    $('#overlay').on('click', function() {
        alert('click');
        submitSpinner(true);
    });
});​
4

4 回答 4

3

你为什么不Spinner从函数中返回对象，并让调用者在它的时间调用 .stop() 呢？读起来更好，而且它不必用随机变量污染局部范围，也使得submitSpinner()更简单。

function createSubmitSpinner() {

    $('body').append('<div id="overlay"><div id="spinner"></div></div>');

    return new Spinner({
        lines: 13,
        length: 15,
        width: 5,
        radius: 20,
        color: '#ffffff',
        speed: 1,
        trail: 60,
        shadow: false
    }).spin(document.getElementById("spinner"));
}


$(function() {
    var spinner = createSubmitSpinner();
    $('#overlay').on('click', function() {
        alert('click');
        spinner.stop();
    });
});
于 2012-07-23T13:17:21.933 回答
2

问题是什么？如您所知，这是一个范围问题，只需将变量声明移到函数之外，使其成为全局变量，并且可以从所有函数调用中访问。

但是，最好不要将其设为全局，而是将停止函数（仅从单击处理程序调用）移至相同的范围：

function createSpinner() {
    var overlay = $('<div id="overlay">'),
        spinner = $('<div id="spinner">');
    $('body').append(overlay.append(spinner));
    var submitSpinner = new Spinner({
        lines: 13,
        length: 15,
        width: 5,
        radius: 20,
        color: '#ffffff',
        speed: 1,
        trail: 60,
        shadow: false
    }).spin(spinner);

    overlay.on('click', function() {
        submitSpinner.stop();
        overlay.remove();
    });
}

$(function() {
    createSpinner();
});
于 2012-07-23T13:12:34.917 回答
0

移动“var theSubmitSpinner;” 函数外：http: //jsfiddle.net/nXbaz/

于 2012-07-23T13:12:38.810 回答
0 
submitSpinner(true);

因为您的范围中有一个重载，所以您必须提供一个。

于 2012-07-23T13:13:55.750 回答