javascript - 如何使用内置进度条获得工作按钮动画？

Question

我需要获得带进度条的工作按钮 like here .我已经设置了资源和 js 绑定(bind)，但由于某种原因按钮没有像示例中那样运行。如何解决？

我的代码:

<button class="progress-button ladda-button" data-color="mint" data-style="expand-right" data-size="xl" name="sendRequest"> <span class="ladda-label">Submit</span>
 <span class="ladda-spinner"></span>

    <div class="ladda-progress" style="width: 160px;"></div>
</button>

Ladda.bind('.ladda-button .progress-button button', {
    callback: function (instance) {
        var progress = 0;
        var interval = setInterval(function () {
            progress = Math.min(progress + Math.random() * 0.1, 1);
            instance.setProgress(progress);

            if (progress === 1) {
                instance.stop();
                clearInterval(interval);
            }
        }, 200);
    }
});

http://jsfiddle.net/RCola/4p2jke75/

更新:

我正在学习教程，但仍然可以找到我的 jsfiddle 代码有什么问题。如何让它发挥作用？

Answer 1

看看这个例子应该会有帮助Example!