如何获得内置进度条的工作按钮动画

How to get working button animation with built-in progress bar?

本文关键字：工作 按钮 动画 何获得 内置      更新时间：2023-09-26

我需要像这里一样获得带有进度条的工作按钮。我已经设置了资源，js绑定，但由于某些原因，按钮的作用与示例中不同。如何修复？

我的代码：

<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代码有什么问题。如何使其发挥作用？

看看这个例子，它应该很有帮助！

相关文章：